RestrictionTarget: fromElement() 静态方法
RestrictionTarget 接口的 fromElement() 静态方法返回一个 RestrictionTarget 实例,该实例可用于将捕获的视频轨道限制为指定的 DOM 元素(及其后代)。
语法
js
RestrictionTarget.fromElement(element)
参数
element-
您想用作限制目标的
Element的引用。要使元素用作限制目标,它必须如果不满足上述条件,则认为它不符合限制条件。
此外,如果正在限制的轨道具有克隆(即,由
BrowserCaptureMediaStreamTrack.clone()创建)或是从不同于用户当前标签页的标签页捕获的(例如,通过Window.postMessage()传递),则该元素不会被捕获。
注意: 捕获元素时,其上设置的任何 alpha 通道值都不会包含在内。如果限制目标元素是半透明的,它在捕获后将完全不透明,因此看起来会不同。
返回值
一个 Promise,它解析为一个 RestrictionTarget 对象实例,然后该实例可以传递给 BrowserCaptureMediaStreamTrack.restrictTo(),以便将轨道中捕获的视频限制为 RestrictionTarget 创建时指定的特定 DOM 元素。
RestrictionTarget 对象是可序列化的。它们可以通过 Window.postMessage() 等机制传递到另一个文档。
如果限制目标元素不符合限制条件,则 Promise 会被拒绝。
示例
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。
规范
| 规范 |
|---|
| 元素捕获 # dom-restrictiontarget-fromelement |
浏览器兼容性
加载中…