Limited availability
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
The restrictTo()
method of the BrowserCaptureMediaStreamTrack
interface restricts a self-capture stream to a specific DOM element (and its descendants).
restrictTo(restrictionTarget)
Parameters
restrictionTarget
A RestrictionTarget
instance representing the element the stream should be restricted to, or null
/undefined
, in which case any previously-set restriction is removed from the track.
A Promise
that resolves to undefined
.
The promise will reject if:
kind
is not "video"
, or its readyState
is not "live"
.restrictionTarget
is not a RestrictionTarget
instance, null
, or undefined
.restrictionTarget
was created in a tab other than the one being captured.Note: In Chromium, if a track has clones, restrictTo()
will reject (see Chrome issue 41482026).
// Options for getDisplayMedia()
const displayMediaOptions = {
preferCurrentTab: true,
};
// Create restriction target from DOM element
const demoElem = document.querySelector("#demo");
const restrictionTarget = await RestrictionTarget.fromElement(demoElem);
// Capture video stream from user's webcam and isolate video track
const stream =
await navigator.mediaDevices.getDisplayMedia(displayMediaOptions);
const [track] = stream.getVideoTracks();
// Restrict video track
await track.restrictTo(restrictionTarget);
// Broadcast restricted stream in <video> element
videoElem.srcObject = stream;
See Using the Element Capture and Region Capture APIs for in-context example code.
Stopping the restrictionYou can stop the restriction by making a call to restrictTo()
on the same track, passing an argument of null
to it:
// Stop restricting
await track.restrictTo(null);
Specifications Browser compatibility See also
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4