MediaSource: sourceopen 事件
注意：此功能在 專用 Web Workers 中可用。
當 MediaSource 物件的 readyState 更改為 "open" 時，會觸發 sourceopen 事件。這表示 MediaSource 已準備好接收來自 SourceBuffer 物件的資料。這可能在 MediaSource 物件首次附加到媒體元素時發生，也可能在 readyState 從 "ended" 更改回 "open" 時發生。
語法
在諸如 addEventListener() 之類的方法中使用事件名稱，或設定事件處理程式屬性。
js
addEventListener("sourceopen", (event) => {});
onsourceopen = (event) => {};
事件型別
一個通用的 Event。
示例
處理 sourceopen 事件
本示例設定了一個 MediaSource，將其連線到一個 video 元素，並監聽 sourceopen 事件。當事件觸發時，它會新增一個 SourceBuffer 來處理影片資料，獲取資料，將其追加到緩衝區，最後在源結束時撤銷物件 URL。
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);
});
規範
| 規範 |
|---|
| Media Source Extensions™ # dfn-sourceopen |
瀏覽器相容性
載入中…