ManagedMediaSource: startstreaming-Ereignis
Eingeschränkt verfügbar
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Want more browser support for this feature? Tell us why.
Hinweis: Diese Funktion ist in Dedicated Web Workers verfügbar.
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Das startstreaming-Ereignis der ManagedMediaSource-Schnittstelle wird ausgelöst, wenn sich die streaming-Eigenschaft von false zu true ändert. Dies zeigt an, dass der User Agent weitere Daten benötigt, um eine unterbrechungsfreie Wiedergabe sicherzustellen. Die Anwendung sollte daher beginnen, Mediensegmente abzurufen und anzuhängen.
Syntax
Verwenden Sie den Ereignisnamen in addEventListener():
addEventListener("startstreaming", (event) => {});
Alternativ können Sie der Event-Handler-Eigenschaft der Schnittstelle einen Wert zuweisen:
onstartstreaming = (event) => {};
Ereignistyp
Ein generisches Event.
Beispiele
>Daten als Reaktion auf startstreaming abrufen
Dieses Beispiel erstellt eine ManagedMediaSource, verknüpft sie mit einem <video>-Element und verwendet das startstreaming-Ereignis, um mit dem Abrufen und Anhängen von Mediendaten zu beginnen.
const videoUrl =
"https://mdn.github.io/shared-assets/videos/flower-fragmented.mp4";
const mediaType = 'video/mp4; codecs="avc1.64001F, mp4a.40.2"';
if (ManagedMediaSource.isTypeSupported(mediaType)) {
const video = document.createElement("video");
const source = new ManagedMediaSource();
video.controls = true;
video.disableRemotePlayback = true;
video.src = URL.createObjectURL(source);
document.body.appendChild(video);
source.addEventListener("sourceopen", () => {
const sourceBuffer = source.addSourceBuffer(mediaType);
source.addEventListener("startstreaming", async () => {
console.log("startstreaming — fetching media data");
const response = await fetch(videoUrl);
const data = await response.arrayBuffer();
sourceBuffer.appendBuffer(data);
});
});
}
Spezifikationen
| Spezifikation |
|---|
| Media Source Extensions™> # dfn-startstreaming> |