MediaSource: sourceclose-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 sourceclose-Ereignis wird ausgelöst, wenn sich der readyState eines MediaSource-Objekts auf "closed" ändert. Dies weist darauf hin, dass die MediaSource von dem Medien-Element getrennt wurde.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignis-Handler-Eigenschaft.
addEventListener("sourceclose", (event) => { })
onsourceclose = (event) => { }
Ereignistyp
Ein generisches Event.
Beispiele
>Umgang mit dem sourceclose-Ereignis
Dieses Beispiel zeigt, wie ein Medien-Element von einer MediaSource getrennt wird und wie das sourceclose-Ereignis zur ordnungsgemäßen Ressourcenverwaltung behandelt wird. Der Code richtet eine MediaSource ein, verbindet sie mit einem Video-Element und hört auf das sourceclose-Ereignis. Wenn das Ereignis ausgelöst wird, führt es Bereinigungsaufgaben aus (revokeObjectURL).
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
| Specification |
|---|
| Media Source Extensions™> # dfn-sourceclose> |
Browser-Kompatibilität
Loading…