我们目前正在开发一个网站,该网站允许用户播放连接到audiocontext的简单音频标签。我们知道IOS的技术问题,例如由用户手势启动的播放。一切正常,直到IOS12。既然IOS13已经发布,那么什么也无法工作了。
它适用于所有台式机,Android和IOS(最高IOS13)。
有什么想法吗?
使用连接到iPhone的Desktop上的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>
1
我的应用程序也已损坏。但是我看到您在单击之前创建了音频上下文,这在ios 12中也是不允许的。
—
shukshin.ivan
该
—
Paulie,
audioContext.resume();
行应该解决这一问题,但我认为应在promise解析中进行如下操作:audioContext.resume()。then(function(){player.play()playbutton.innerHTML =“ Pause”; playStatus = 'isPlaying';}
我已经在Codepen中添加了Promise。但是,不管有没有承诺,它都不会改变任何东西。
—
约翰·洛伊德(JohnLoyd),
我也有同样的问题。唯一的区别是音频标签在单个页面应用程序中动态呈现。我通过
—
裤子
src
使用完整的URL 使其成为静态对象而部分起作用。但是,仅当您离开Safari然后再次打开它时,它才有效。非常奇怪的行为。