BrowserCaptureMediaStreamTrack:restrictTo() 方法
BrowserCaptureMediaStreamTrack 接口的 restrictTo() 方法将自捕获流限制到特定的 DOM 元素(及其后代)。
语法
js
restrictTo(restrictionTarget)
参数
restrictionTarget-
一个
RestrictionTarget实例,表示要将流限制到的元素,或者null/undefined,在这种情况下,将从轨道中移除任何先前设置的限制。
返回值
Promise 将会拒绝,如果
- 轨道
kind不是"video",或者其readyState不是"live"。 - 限制目标元素已不存在。
- 正在限制的轨道不是从用户屏幕捕获的轨道。
restrictionTarget不是RestrictionTarget实例、null或undefined。restrictionTarget是在捕获标签页以外的标签页中创建的。
注意: 在 Chromium 中,如果一个轨道有克隆,restrictTo() 将会拒绝(请参阅 Chrome issue 41482026)。
示例
基本限制示例
js
// 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;
有关上下文中的示例代码,请参阅 使用元素捕获和区域捕获 API。
停止限制
您可以通过在同一轨道上调用 restrictTo() 并传递 null 作为参数来停止限制。
js
// Stop restricting
await track.restrictTo(null);
规范
| 规范 |
|---|
| 元素捕获 # dom-browsercapturemediastreamtrack-restrictto |
浏览器兼容性
加载中…