HTML VON A BIS Z-Z VIII: video und audio

Weltklasse, der Rap am Ende

Zu dem Thema „autoplay“ (und auch der .play()-Methode) kann ich noch ein paar Nuancen ergänzen, und zwar ist es so, dass autoplay immer unterbunden wird, wenn noch keine User-Interaktion stattgefunden hat, allerdings mit Ausnahme von auf „muted“ gesetzten Videos oder Videos ohne Audio-Track. Stefan, der früher bei einer Agentur gearbeitet hat, die Games für das Web veröffentlicht hat, hat mal erzählt, wie sie das Problem mit dem Audio-Abspielen gelöst haben. Sie haben den Spielen immer einen „Start“-Screen vorgeschaltet, den man klicken musste, nach dem der Browser das Audio-Abspielen erlaubt.

Dann gibt es aber andererseits Seiten, die aus irgendwelchen Gründen das eigentlich verbotene Video-Autoplay ohne Interaktion doch hinbekommen, wie zum Beispiel youtube.com. Wenn Ihr als Beispiel den Link zu diesem iPhone Review öffnet, dann läuft das Video sofort mit Ton los, ohne vorherige Interaktion. Das hat zumindest in Chrome mit dem „Media Engagement Index“ zu tun. Bei dem wertet der Browser historisch aus, wie oft man bei dem Besuch (Session) dieser Seite ein Medium abgespielt hat. Liegt man hier über 0.3, also wurde in über 30% der Seitenbesuche ein Abspielvorgang initiiert, kommt die Seite auf die interne Allowlist für Autoplay mit Ton. Und rausfliegen tut sie, sobald sie 0.2 / 20% unterschreitet. Die Seite, über die der Browser Buch führt, findet man unter chrome://media-engagement/.

Und dann gibt es noch in Browser fest hinterlegte Allowlisten. So wird das obige Youtube-Video auch in einem nie benutzten Safari abgespielt, in welchem man der Seite in den Webseiten-Einstellungen bislang keine Erlaubnis gegeben hat.

In der Folge der Einführung dieser Verhaltensänderungen der Browser ab 2011 herum ergab sich aber ein Problem, nämlich, dass die Entwickelnden den Aufruf des .play()-Befehls fürderhin in einen try/catch-Block packen mussten, wenn sie einen Abspiel-Error durch Verweigerung abfangen wollten. Darum wurde die HTML-Spec nachträglich dahingehend geändert, dass play() eine Promise zurückgibt, die entweder resolved oder rejected. Die Browser haben das mittlerweile auch alle implementiert. Die Promise ist darüberhinaus auch hilfreich dabei, wenn man kurz nach dem play()-Command ein pause() ausführen möchte. Manchmal reicht die Zeit (oder die Bandbreite) nicht, dass der Browser tatsächlich ans Abspielen kommt, woraufhin pause() einen Error erzeugt (und Euren JavaScript-Executionstack in den Orkus schickt). Dank der Promise kann man pause() daran koppeln, dass sie resolved ist.