Menu
We are currently developing a website that allows users to play simple audio tags connected to the audiocontext. We are aware of technical issues with IOS such as playback initiated by user gestures. Everything is working fine up to IOS12. Now that IOS13 is out, nothing works anymore.
It works on all desktops, android and IOS up to IOS13.
Any idea on what is going on?
There are no error messages in the console when debugging with Safari on Desktop connected to the iphone.
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>
835
This issue was mistakenly reported as fixed in iOS 13.3.1 (January 28, 2020). Nevertheless, as anyone can read from this WebKit bug report 203435, the problem is still there as of April 7, 2020, the release date of iOS 13.4.1.
The bug report doesn't provide any further information in regards to the estimated date this bug is going to be fixed. Sadly, 80% of iOS users (about 14% of the total mobile market, according to Statcounter) have been mistakenly incapacitated from using WebAudio on their devices for months, now.
What makes things worse for us developers is that Safari doesn't report any error. Thus, even trying to imagine a fallback is not possible or very hard, anyway.
70
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
