MediaSource: handle プロパティ

Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

注: この機能は Web Worker 内で利用可能です。

handle は MediaSource インターフェイスの読み取り専用プロパティで、 MediaSourceHandle (en-US) オブジェクトを返します。このオブジェクトは MediaSource のプロキシーであり、専用ワーカーからメインスレッドに戻り、HTMLMediaElement.srcObject プロパティを介してメディア要素に結び付けられます。

メモ: handle は専用ワーカー内の MediaSource インスタンスでのみ表示されます。

専用ワーカー内で作成された MediaSource オブジェクトは、それぞれ自分自身で個別の MediaSourceHandle を保有します。 handle ゲッターは常に、関連する専用ワーカー MediaSource インスタンス固有の MediaSourceHandle インスタンスを返します。ハンドルが既に postMessage() を使用してメインスレッドに移譲されている場合、ワーカー内のハンドルインスタンスは技術的に切り離され、再度移譲することはできません。

値

MediaSourceHandle (en-US) オブジェクトインスタンスです。

例

handle プロパティは専用ワーカーの内部でアクセスすることができ、結果 MediaSourceHandle (en-US) オブジェクトは postMessage() 呼び付けによってワーカーを作成したスレッド (この場合はメインスレッド) に移譲されます。

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> に取り付け、再生 動画を再生します。

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

メモ: MediaSourceHandle (en-US)は、共有ワーカーまたはサービスワーカーからは正常に移譲できません。

仕様書

Specification
Media Source Extensions™
# dom-mediasource-handle

ブラウザーの互換性

BCD tables only load in the browser

関連情報