iOS 크롬에서 <audio> 태그를 자바에서 재생

업데이트 문제는 Google 드라이브 문제로 판명되었습니다. 어떤 이유에서 모바일 브라우저의 파일은 완전히 공개로 설정해야 데스크톱 브라우저의 파일을 "링크가있는 모든 사용자"와 재생할 수 있습니다. 괜찮은 오류보고가 부족하여 추적하기가 어려웠습니다.iOS 크롬에서 <audio> 태그를 자바에서 재생

문제점 : HTML5 태그를 재생하려면 버튼을 클릭은 아이폰 OS에서 모바일 크롬 또는 모바일 사파리에 완벽하게 모든 데스크톱 브라우저에 있지만 작동합니다. (안드로이드에서 테스트하지 않은).

이 예제는 테스트 한 모든 데스크톱 브라우저에서 완벽하게 작동하지만 iOS Chrome 또는 iOS safari는 완벽하게 작동하지 않습니다. 나는 이유를 알 수 없다. 여기에 div를 작성했지만, 몇 가지가있을 수 있으므로 프로그래밍 방식으로 작성하고 있습니다. 테스트를 위해 나는 아래에 제시된 것을 사용했다.

사업부 : (아래 'myfileidgoeshere이'여기 제거 실제 ID입니다 ..)

<div id="user0"> 
<div><img src="icon.png" class="icon">Title</div> 
<div class="buttons"> 
    <div><audio id="player_user0"> 
     <source id="src_user0" src="https://googledrive.com/host/myfileidgoeshere" type="audio/mp3"></audio> 
     </div> 
     <button type="button" class="btn" onclick="playUserAudio2(this)"> 
<span class="glyphicon glyphicon-play white play"></span></button> 
</div></div>

재생 기능 : (내가 프로그래밍 내가 가지고있는 위의 사업부를 쓰고 있기 때문에 변수를 얻을 수 있습니다.

function playUserAudio2(target) { 
    var id = $(target).parent().parent().closest('div').attr('id'); 
    var link = $('#src_'+id).attr('src'); 
    var myAudio=document.getElementById('player_'+id); 

    //some graphical tweaks to show/hide play pause button 
    var toggle = $(target).find('span.play'); 
    if(toggle.hasClass('glyphicon-play')){ 

     active = $(target).parent().addClass('glow'); 
     toggle.removeClass('glyphicon-play'); 
     toggle.addClass('glyphicon-stop'); 

      myAudio.play(); 

      $('#player_'+id).on("ended", function(){ 
        toggle.removeClass('glyphicon-stop'); 
        toggle.addClass('glyphicon-play'); 
         }) 

    }else{ 

     toggle.removeClass('glyphicon-stop'); 
     toggle.addClass('glyphicon-play'); 

     myAudio.pause(); 
     myAudio.currentTime=0.0; //pause and reset the time to stop. 
     }

을}

출처

2016-08-12 dijon

[this] (http://stackoverflow.com/questions/32945273/how-to-autoplay-html5-video-and-audio-tags-on-ios)의 중복이 너무 궁금하십니까? –

아니요, 자동 재생을 시도하지 않습니다. – dijon

문제가 Google 드라이브 문제로 판명되었습니다. 어떤 이유로 데스크톱 브라우저의 파일을 '링크가있는 모든 사용자'와 재생할 수 있도록하려면 모바일 브라우저의 파일을 Google 드라이브에서 완전히 공개로 설정해야합니다. 모바일에서 알맞은 오류보고가 부족하여 추적하기가 어려웠습니다.

출처

2016-08-12 19:03:47 dijon

iOS 크롬에서 <audio> 태그를 자바에서 재생

답변

관련 문제