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 |
瀏覽器相容性
載入中…