HTMLCanvasElement: captureStream() 方法
HTMLCanvasElement 接口的 captureStream() 方法会返回一个 MediaStream 对象，其中包含一个 CanvasCaptureMediaStreamTrack，用于实时捕获 canvas 的内容。
语法
js
captureStream()
captureStream(frameRate)
参数
frameRate可选-
一个双精度浮点数值，用于指示每个帧的捕获速率。如果未设置，则每次 canvas 更改时都会捕获一个新帧；如果设置为
0，则不会自动捕获帧；相反，只有当返回的轨道的requestFrame()方法被调用时，才会捕获帧。
返回值
指向一个 MediaStream 对象的引用，该对象包含一个 CanvasCaptureMediaStreamTrack。
异常
NotSupportedErrorDOMException-
如果
frameRate的值为负数，则会抛出此错误。 SecurityErrorDOMException-
Canvas 的位图不是 origin clean；至少部分内容已从加载文档的站点以外的站点加载，或可能已从其他站点加载。
示例
js
// Find the canvas element to capture
const canvasElt = document.querySelector("canvas");
// Get the stream
const stream = canvasElt.captureStream(25); // 25 FPS
// Do things to the stream
// E.g. Send it to another computer using an RTCPeerConnection
// pc is an RTCPeerConnection created elsewhere
stream.getTracks().forEach((track) => pc.addTrack(track, stream));
规范
| 规范 |
|---|
| 从 DOM 元素捕获媒体 # dom-htmlcanvaselement-capturestream |
浏览器兼容性
加载中…
另见
HTMLMediaElement.captureStream()，允许从媒体元素捕获流。MediaStream- 媒体捕获和流 API