VideoTrackGenerator
注意:此功能僅在 專用 Web Worker 中可用。
VideoTrackGenerator 介面屬於 Insertable Streams for MediaStreamTrack API,它有一個 WritableStream 屬性,該屬性透過接收 VideoFrame 幀流作為輸入,充當 MediaStreamTrack 的源。
建構函式
VideoTrackGenerator()Experimental-
建立一個新的
VideoTrackGenerator物件,該物件接受VideoFrame物件。
例項屬性
VideoTrackGenerator.mutedExperimental-
一個布林屬性,用於臨時暫停或恢復輸出軌道上的影片幀生成。
VideoTrackGenerator.trackExperimental-
輸出的
MediaStreamTrack。 VideoTrackGenerator.writableExperimental-
輸入的
WritableStream。
示例
以下示例來自文章 Unbundling MediaStreamTrackProcessor and VideoTrackGenerator。它將相機 MediaStreamTrack 傳輸到工作執行緒進行處理。工作執行緒建立一個管道,對影片幀應用棕褐色濾鏡並進行映象。該管道最終匯聚到一個 VideoTrackGenerator,其 MediaStreamTrack 被傳輸回來並播放。媒體現在透過主執行緒的變換即時流動。
js
const stream = await navigator.mediaDevices.getUserMedia({ video: true });
const [track] = stream.getVideoTracks();
const worker = new Worker("worker.js");
worker.postMessage({ track }, [track]);
const { data } = await new Promise((r) => {
worker.onmessage = r;
});
video.srcObject = new MediaStream([data.track]);
worker.js
js
onmessage = async ({ data: { track } }) => {
const vtg = new VideoTrackGenerator();
self.postMessage({ track: vtg.track }, [vtg.track]);
const { readable } = new MediaStreamTrackProcessor({ track });
await readable
.pipeThrough(new TransformStream({ transform }))
.pipeTo(vtg.writable);
};
規範
| 規範 |
|---|
| 使用流進行 MediaStreamTrack 可插入媒體處理 # videotrackgenerator |
瀏覽器相容性
載入中…