MediaSource: handle 属性

可用性有限

此特性不是基线特性,因为它在一些最广泛使用的浏览器中不起作用。

注意:此功能仅在 专用 Web Worker 中可用。

MediaSource 接口的只读属性 handle 返回一个 MediaSourceHandle 对象。它是一个 MediaSource 的代理,可以从专用 worker 传输回主线程,并通过 HTMLMediaElement.srcObject 属性附加到媒体元素上。

注意: handle 属性仅在专用 worker 内部的 MediaSource 实例上可见。

在专用 worker 中创建的每个 MediaSource 对象都有自己独立的 MediaSourceHandlehandle getter 始终返回与关联的专用 worker MediaSource 实例特定的 MediaSourceHandle 实例。如果句柄已经使用 postMessage() 传输到主线程,那么 worker 中的句柄实例实际上已分离,无法再次传输。

一个 MediaSourceHandle 对象实例。

示例

可以在专用 worker 内部访问 handle 属性,然后通过 postMessage() 调用将生成的 MediaSourceHandle 对象传输到创建 worker 的线程(在本例中为主线程)。

js
// Inside dedicated worker
let mediaSource = new MediaSource();
let handle = mediaSource.handle;
// Transfer the handle to the context that created the worker
postMessage({ arg: handle }, [handle]);

mediaSource.addEventListener("sourceopen", () => {
  // Await sourceopen on MediaSource before creating SourceBuffers
  // and populating them with fetched media — MediaSource won't
  // accept creation of SourceBuffers until it is attached to the
  // HTMLMediaElement and its readyState is "open"
});

在主线程中,我们通过 message 事件处理器接收句柄,通过其 HTMLMediaElement.srcObject 属性将其附加到 <video> 元素,然后 play 视频。

js
worker.addEventListener("message", (msg) => {
  let mediaSourceHandle = msg.data.arg;
  video.srcObject = mediaSourceHandle;
  video.play();
});

注意: MediaSourceHandle 无法成功传输到共享工作线程或服务工作线程中,或通过它们进行传输。

规范

规范
Media Source Extensions™
# dom-mediasource-handle

浏览器兼容性

另见