MediaSource: sourceended Ereignis
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Hinweis: Diese Funktion ist in Dedicated Web Workers verfügbar.
Das sourceended Ereignis wird ausgelöst, wenn sich der readyState eines MediaSource Objekts in "ended" ändert. Dies zeigt an, dass die Anwendung das Senden von Daten an die MediaSource abgeschlossen hat. Wenn eine Anwendung das Anhängen aller Mediendaten an die mit einer MediaSource verbundenen SourceBuffer Objekte beendet hat, ruft sie die Methode MediaSource.endOfStream() auf der MediaSource auf. Dies führt dazu, dass der readyState in "ended" übergeht und das sourceended Ereignis ausgelöst wird.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignis-Handler-Eigenschaft.
addEventListener("sourceended", (event) => {})
onsourceended = (event) => {}
Ereignistyp
Ein generisches Event.
Beispiele
Behandlung des sourceopen-Ereignisses
Dieses Beispiel zeigt, wie ein Videoelement für die Wiedergabe eingerichtet wird und das sourceended Ereignis zur ordnungsgemäßen Ressourcenverwaltung behandelt wird. Der Code richtet eine MediaSource ein, initiiert die Wiedergabe durch Abrufen und Puffern von Videodaten und verwendet dann das sourceended Ereignis, um Aufräumaufgaben wie das Entfernen von Ereignis-Listenern auszuführen und den Benutzer zu benachrichtigen, wenn die Wiedergabe abgeschlossen ist.
const video = document.getElementById("myVideo");
const mediaSource = new MediaSource();
video.src = URL.createObjectURL(mediaSource);
mediaSource.addEventListener("sourceopen", (event) => {
const sourceBuffer = mediaSource.addSourceBuffer(
'video/mp4; codecs="avc1.42E01E"',
);
fetch("video-data.mp4")
.then((response) => response.arrayBuffer())
.then((data) => {
sourceBuffer.appendBuffer(data);
sourceBuffer.addEventListener("updateend", () => {
mediaSource.endOfStream();
});
});
});
mediaSource.addEventListener("sourceended", (event) => {
console.log("MediaSource sourceended:", event);
URL.revokeObjectURL(video.src);
// Perform cleanup
// Remove event listeners from SourceBuffer and MediaSource
sourceBuffer.removeEventListener("updateend", () => {});
mediaSource.removeEventListener("sourceopen", () => {});
// Notify user (e.g., display a "Playback finished" message)
const messageElement = document.createElement("p");
messageElement.textContent = "Playback finished.";
document.body.appendChild(messageElement);
});
Spezifikationen
| Specification |
|---|
| Media Source Extensions™ # dfn-sourceended |
Browser-Kompatibilität
Loading…