Hat IOS13 defekte <audio> -Tags als Audiopuffer verwendet, die mit dem Audiokontext verbunden sind?


9

Wir entwickeln derzeit eine Website, auf der Benutzer einfache Audio-Tags abspielen können, die mit dem Audiokontext verbunden sind. Wir sind uns technischer Probleme mit IOS bewusst, z. B. der Wiedergabe, die durch Benutzergesten ausgelöst wird. Bis IOS12 funktioniert alles einwandfrei. Jetzt, wo IOS13 nicht mehr verfügbar ist, funktioniert nichts mehr.

Es funktioniert auf allen Desktops, Android und IOS bis IOS13.

Irgendeine Idee, was los ist?

Beim Debuggen mit Safari on Desktop, das mit dem iPhone verbunden ist, werden in der Konsole keine Fehlermeldungen angezeigt.

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
Meine App ist ebenfalls kaputt. Aber ich sehe, dass Sie vor dem Klicken einen Audiokontext erstellen. Dies war auch in iOS 12 nicht zulässig.
Shukshin.ivan

Die audioContext.resume();Zeile sollte sich darum kümmern, aber ich denke, was folgt, sollte in der Versprechungsauflösung wie folgt sein: audioContext.resume (). Then (function () {player.play () playbutton.innerHTML = "Pause"; playStatus = 'isPlaying';}
Paulie

Ich habe das Versprechen bereits im Codepen hinzugefügt. Aber mit oder ohne Versprechen ändert es nichts.
JohnLoyd

Ich habe das gleiche Problem. Der einzige Unterschied besteht darin, dass das Audio-Tag in einer App mit nur einer Seite dynamisch gerendert wird. Ich habe es teilweise zum Laufen gebracht, indem ich die srcStatik mit einer vollständigen URL erstellt habe. Es funktioniert jedoch nur, wenn Sie Safari verlassen und dann erneut öffnen. Sehr seltsames Verhalten.
Hosen

Antworten:


2

Leider wurde AudioContext.createMediaElementSourceseit der Veröffentlichung von iOS 13 ein Fehler behoben. Der Fehler wurde behoben: https://bugs.webkit.org/show_bug.cgi?id=203435 . Es befindet sich in der Safari Technology Preview 99 .


Es sieht so aus, als hätten die Entwickler des Webkits das Problem vor einigen Tagen behoben. Ich habe jedoch immer noch das Problem mit der neuesten iOS-Version. Wird es mit der nächsten iOS- oder Webkit-Version behoben? Ich bin verwirrt.
Regenschirm

0

Dieses Problem wurde fälschlicherweise als in iOS 13.3.1 (28. Januar 2020) behoben gemeldet. Wie jeder aus diesem WebKit-Fehlerbericht 203435 lesen kann , besteht das Problem jedoch weiterhin ab dem 7. April 2020, dem Veröffentlichungsdatum von iOS 13.4.1.

Der Fehlerbericht enthält keine weiteren Informationen zum voraussichtlichen Datum, an dem dieser Fehler behoben wird. Leider sind 80% der iOS-Benutzer (laut Statcounter etwa 14% des gesamten Mobilfunkmarktes) seit Monaten fälschlicherweise nicht mehr in der Lage, WebAudio auf ihren Geräten zu verwenden.

Was die Sache für uns Entwickler noch schlimmer macht, ist, dass Safari keinen Fehler meldet. Daher ist es ohnehin nicht möglich oder sehr schwierig, sich einen Fallback vorzustellen.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.