MediaSource: sourceclose-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.
Das sourceclose-Ereignis wird ausgelöst, wenn sich der readyState eines MediaSource-Objekts zu "closed" ändert. Dies zeigt an, dass die MediaSource vom Medienelement getrennt wurde.
Syntax
Verwenden Sie den Ereignisnamen in addEventListener():
addEventListener("sourceclose", (event) => { })
Alternativ können Sie ihn der Event-Handler-Eigenschaft der Schnittstelle zuweisen:
onsourceclose = (event) => { }
Ereignistyp
Ein generisches Event.
Beispiele
>Das sourceclose-Ereignis behandeln
Dieses Beispiel zeigt, wie ein Medienelement von einer MediaSource getrennt und das sourceclose-Ereignis behandelt wird, um Ressourcen ordnungsgemäß freizugeben. Der Code richtet eine MediaSource ein, verknüpft sie mit einem Videoelement und überwacht das sourceclose-Ereignis. Wenn das Ereignis ausgelöst wird, gibt er Ressourcen mithilfe von revokeObjectURL frei.
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);
});
});
function detachMediaSource() {
video.src = null; // Detach the MediaSource
}
mediaSource.addEventListener("sourceclose", (event) => {
console.log("MediaSource sourceclose:", event);
// Perform cleanup tasks here, e.g., release resources, update UI
URL.revokeObjectURL(video.src); // Clean up the object URL
});
// Call detachMediaSource() when appropriate, e.g., on a button click
document
.getElementById("detachButton")
.addEventListener("click", detachMediaSource);
Spezifikationen
| Spezifikation |
|---|
| Media Source Extensions™> # dfn-sourceclose> |