現在、オーディオコンテキストに接続されたシンプルなオーディオタグを再生できるWebサイトを開発しています。ユーザーのジェスチャーによって開始される再生など、IOSの技術的な問題を認識しています。IOS12まではすべて正常に動作しています。IOS13がリリースされたので、何も動作しなくなりました。
これは、すべてのデスクトップ、Android、およびIOS13までのIOSで動作します。
何が起こっているかについての考えはありますか?
iPhoneに接続されたデスクトップ上のSafariでデバッグするときに、コンソールにエラーメッセージはありません。
https://codepen.io/gchad/pen/WNNvzzd
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr">
<body>
<div>
<h1>Play Audio Tag connected to audio context</h1>
<div id="playbutton" style="width:100px; height:100px; background:blue; color:white; margin:auto; text-align: center; font-size: 30px; cursor: pointer;">
Play
</div>
<audio id="myPlayer" crossorigin="anonymous" >
<source src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/858/outfoxing.mp3"/>
<!--http://commondatastorage.googleapis.com/codeskulptor-assets/week7-brrring.m4a-->
</audio>
</div>
<script>
var player = document.getElementById('myPlayer'),
playbutton = document.getElementById('playbutton'),
playStatus = 'paused';
var audioContext = new(window.AudioContext || window.webkitAudioContext)();
var audioSource = audioContext.createMediaElementSource(player);
audioSource.connect(audioContext.destination);
playbutton.addEventListener('click',function(ev){
if( playStatus == 'paused'){
audioContext.resume();
player.play();
playbutton.innerHTML = "Pause";
playStatus = 'isPlaying';
} else {
player.pause();
playbutton.innerHTML = "Play";
playStatus = 'paused';
}
});
</script>
</body>
audioContext.resume();
ラインは、そのの世話をする必要がありますが、私はこのように、約束の解決である必要があり、以下のものを考える:。audioContext.resume()、その後(機能(){player.play()playbutton.innerHTML =「一時停止」; playStatus = 'isPlaying';}
src
完全なURLで静的にすることで、部分的に機能しました。ただし、Safariを終了してから再度開く場合にのみ機能します。非常に奇妙な行動。