Verbesserungen bei der Bildschirmfreigabe in Chrome 109

François Beaufort

Elad Alon

Web-Apps können bereits getDisplayMedia() verwenden, um Tabs, Fenster oder Bildschirme als MediaStream aufzunehmen. Ab Chrome 109 stehen Ihnen die folgenden Verbesserungen zur Verfügung:

• Wenn die Bildschirmfreigabe gestartet wird, kann die Web-App, die die Aufnahme ausführt, mithilfe der Option Bedingter Fokus festlegen, ob der Browser den aufgenommenen Tab oder das aufgenommene Fenster in den Fokus stellt oder ob der Tab für die Aufnahme aktiv bleibt.
• Mit der Option suppressLocalAudioPlayback wird festgelegt, ob Audioinhalte, die in einem Tab wiedergegeben werden, über die Lautsprecher des Nutzers abgespielt werden.

Bedingter Fokus

Mit dem bedingten Fokus können Web-Apps jetzt festlegen, ob der Tab oder das Fenster, das erfasst wird, beim Start der Aufnahme den Fokus erhält oder ob die Seite, die erfasst wird, im Fokus bleiben soll.

const controller = new CaptureController();
// Prompt the user to share a tab, a window or a screen.
const stream =
    await navigator.mediaDevices.getDisplayMedia({ controller });

const [track] = stream.getVideoTracks();
const displaySurface = track.getSettings().displaySurface;
if (displaySurface === "browser") {
  // Focus the captured tab.
  controller.setFocusBehavior("focus-captured-surface");
} else if (displaySurface === "window") {
  // Do not move focus to the captured window.
  // Keep the capturing page focused.
  controller.setFocusBehavior("no-focus-change");
}

Weitere Informationen finden Sie unter Verbesserte Bildschirmfreigabe mit bedingtem Fokus.

Lokale Audiowiedergabe unterdrücken

Es ist üblich, dass sich Kollegen in einem Raum versammeln, damit einer von ihnen von seinem Laptop aus eine Präsentation auf einem Monitor mit Lautsprechern in einem Konferenzraum halten kann. Der Vortragende schaltet in der Regel den Ton seines Laptops stumm und verwendet die externen Lautsprecher, die oft lauter sind. So wird auch sichergestellt, dass der Ton mit dem Video synchronisiert ist. Die Audioeinschränkung suppressLocalAudioPlayback spart hier Zeit. Wenn diese Option auf true gesetzt ist, sollte der Browser beim Starten der Aufzeichnung aufhören, Audio an die lokalen Lautsprecher weiterzuleiten. Der Standardwert für diese Einschränkung ist false.

// Prompt the user to share a tab, a window or a screen with audio.
// If successful, stop the captured audio from being played out over
// the local device's speakers.
const stream = await navigator.mediaDevices.getDisplayMedia({
  audio: { suppressLocalAudioPlayback: true },
});
const [audioTrack] = stream.getAudioTracks();
const settings = audioTrack.getSettings();
console.log(settings.suppressLocalAudioPlayback); // true

Zum Zeitpunkt der Erstellung dieses Artikels funktioniert suppressLocalAudioPlayback nicht mit applyConstraints(). Siehe Fehler 1381959.

Danksagungen

Vielen Dank an Rachel Andrew für die Überprüfung dieses Dokuments.