Erzwingen der Wiedergabe mit kurzen HTML5-Videos in Safari

Question

Ich habe Probleme mit Safari und demElement in Kombination mit kürzeren qualitativ hochwertigen Videos. Für eine Showcase-Website lade ich 12-15 Sekunden .mp4 und .webm Dateien in einenContainer mit dem <source> Element. Wenn Sie versuchen, das Video in Chrome abzuspielen, funktioniert es einwandfrei und das Video wird fast augenblicklich wiedergegeben. Safari scheint jedoch das Video vollständig laden zu wollen, bevor es mit der Wiedergabe beginnt.

Ich habe in das Laden des Videos direkt über das src Attribut vonuntersucht und auch das Attribut preload="auto" hinzugefügt, um die sofortige Wiedergabe zu erzwingen.

Ich habe ein Beispiel unter Verwendung eines der Videos einrichten wir auf den Internetseiten verwenden, die um 8 MB und 12 Sekunden lang: https://jsfiddle.net/n1eac46v/

var video = document.getElementById('video'); 
var source = document.createElement('source'); 

source.src = "foo.mp4"; 
source.type = "video/mp4"; 

video.appendChild(source); 
video.on("canplay canplaythrough", video.play); 

Wie man sehen kann ich auch hören bin für die canplay und die canplaythrough Ereignisse, aber selbst das scheint nicht zu helfen. Ich habe tagelang überall nachgesehen, aber jetzt gehen mir die Optionen aus.

Answer 1

Ich bin kein OS X-Benutzer, also habe ich keine Erfahrung mit Safari, aber ich hatte die Möglichkeit, mp4-Wiedergabe in Chrome zu debuggen. Chrome hat ein Pufferungsfenster, das es zu füllen versucht, bis es mit der tatsächlichen Wiedergabe beginnt. Safari kann ein größeres Fenster haben. Da im Normalfall alle Tabellen, die Beispielpositionen, -dauern usw. enthalten, am Ende des Dateibrowsers liegen, möchten Sie sie möglicherweise lesen, um mit der Wiedergabe zu beginnen. Ein intelligenter Browser kann einen Lesevorgang mit einem Bytebereich-Header durchführen, um nur das Ende der Datei zu erhalten und dann die tatsächlichen Videodaten zu suchen, aber ich habe wiederum keine Ahnung, was Safari macht.

Was Sie versuchen können, ist MP4Box auf Ihre Videodateien zu verwenden, um die Metadaten und alle Tabellen an den Anfang zu verschieben, die helfen könnten.

Wie von OP in den Kommentaren mit FFmpeg mit -movflags faststart (siehe FFmpeg MP4 options) erwähnt, kann auch dazu verwendet werden, dies zu erreichen.