BrowserCaptureMediaStreamTrack: restrictTo()-Methode

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Die restrictTo()-Methode der BrowserCaptureMediaStreamTrack-Schnittstelle beschränkt einen Selbstaufnahme-Stream auf ein bestimmtes DOM-Element (und dessen Nachkommen).

Syntax

js
restrictTo(restrictionTarget)

Parameter

restrictionTarget

Eine Instanz von RestrictionTarget, die das Element darstellt, auf das der Stream beschränkt werden soll, oder null/undefined, in diesem Fall wird jede zuvor gesetzte Einschränkung vom Track entfernt.

Rückgabewert

Ein Promise, der sich zu undefined auflöst.

Das Promise wird abgelehnt, wenn:

  • Der Track kind nicht "video" ist oder dessen readyState nicht "live" ist.
  • Das Einschränkungsziel-Element nicht mehr existiert.
  • Der Track, der eingeschränkt wird, kein von dem Bildschirm des Benutzers aufgenommener Track ist.
  • restrictionTarget keine Instanz von RestrictionTarget, null oder undefined ist.
  • restrictionTarget in einem anderen als dem aufgenommenen Tab erstellt wurde.

Hinweis: In Chromium, wenn ein Track Klone hat, wird restrictTo() abgelehnt (siehe Chrome issue 41482026).

Beispiele

Grundlegendes Einschränkungsbeispiel

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;

Siehe Verwendung der Elementaufnahme- und Bereichsaufnahme-APIs für Beispielcode im Kontext.

Beenden der Einschränkung

Sie können die Einschränkung beenden, indem Sie einen Aufruf von restrictTo() auf demselben Track machen und dabei null als Argument übergeben:

js
// Stop restricting
await track.restrictTo(null);

Spezifikationen

Specification
Element Capture
# dom-browsercapturemediastreamtrack-restrictto

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch