MediaSource: sourceopen Ereignis

Eingeschränkt verfügbar

Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.

Hinweis: Diese Funktion ist in Dedicated Web Workers verfügbar.

Das sourceopen Ereignis wird ausgelöst, wenn sich der readyState eines MediaSource Objekts in "open" ändert. Dies deutet darauf hin, dass das MediaSource bereit ist, Daten von SourceBuffer Objekten zu empfangen. Dies kann entweder auftreten, wenn das MediaSource Objekt erstmals an ein Medienelement angehängt wird oder wenn sich der readyState von "ended" zurück zu "open" ändert.

In diesem Artikel

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder legen Sie eine Ereignishandler-Eigenschaft fest.

js
addEventListener("sourceopen", (event) => {});

onsourceopen = (event) => {};

Ereignistyp

Ein generisches Event.

Beispiele

Umgang mit dem sourceopen Ereignis

Dieses Beispiel richtet ein MediaSource ein, verbindet es mit einem Video-Element und lauscht auf das sourceopen Ereignis. Wenn das Ereignis ausgelöst wird, wird ein SourceBuffer hinzugefügt, um die Videodaten zu handhaben, die Daten werden abgerufen, dem Puffer hinzugefügt und schließlich die Objekt-URL widerrufen, wenn die Quelle endet.

js
const video = document.getElementById("myVideo");
const mediaSource = new MediaSource();

video.src = URL.createObjectURL(mediaSource);

mediaSource.addEventListener("sourceopen", (event) => {
  console.log("MediaSource sourceopen:", event);
  // Add source buffers and begin adding media data.
  const sourceBuffer = mediaSource.addSourceBuffer(
    'video/mp4; codecs="avc1.42E01E"',
  );
  fetch("video-data.mp4")
    .then((response) => response.arrayBuffer())
    .then((data) => {
      sourceBuffer.appendBuffer(data);
    });
});

mediaSource.addEventListener("sourceended", () => {
  URL.revokeObjectURL(video.src);
});

Spezifikationen

Spezifikation

Media Source Extensions™
# dfn-sourceopen

Browser-Kompatibilität

JavaScript aktivieren, um diese Browser-Kompatibilitätstabelle anzuzeigen.

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

Media Source API
MediaSource
Konstruktor
1. MediaSource()
Statische Eigenschaften
1. canConstructInDedicatedWorker
Instanzeigenschaften
Statische Methoden
1. isTypeSupported()
Instanzmethoden
Events
Vererbung
1. EventTarget
Verwandte Seiten für Media Source Extensions
Anleitungen
1. Transkodierung von Medien für Media Source Extensions
2. DASH Adaptive Streaming für HTML-Video