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 |
浏览器兼容性
加载中…