HTMLCanvasElement: captureStream() method
captureStream() method returns a
which includes a
CanvasCaptureMediaStreamTrack containing a real-time video capture of the canvas's contents.
A double-precision floating-point value that indicates the rate of capture of each frame. If not set, a new frame will be captured each time the canvas changes; if set to
0, frames will not be captured automatically; instead, they will only be captured when the returned track's
requestFrame()method is called.
A reference to a
MediaStream object, which has a single
CanvasCaptureMediaStreamTrack in it.
Thrown if the value of
The canvas's bitmap is not origin clean; at least some of its contents have or may have been loaded from a site other than the one from which the document itself was loaded.
// 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));
|Media Capture from DOM Elements |
BCD tables only load in the browser
HTMLMediaElement.captureStream(), which allows capturing a stream from a media element.
Media Capture and Streams API