Chrome 109 改善分享螢幕畫面功能

François Beaufort

Elad Alon

網頁應用程式已可使用 getDisplayMedia() 擷取分頁、視窗或螢幕畫面，並儲存為 MediaStream。從 Chrome 109 開始，您可以享有下列改善項目：

• 開始螢幕分享時，Conditional Focus 可讓擷取的網頁應用程式控制瀏覽器是否將焦點放在擷取的分頁或視窗，或控制擷取的分頁是否保持活動狀態。
• suppressLocalAudioPlayback 選項可控制分頁播放的音訊是否會透過使用者的本機喇叭播放。

條件焦點

使用條件焦點功能後，網頁應用程式現在可以控制在擷取開始時，系統是否要將焦點放在所擷取的分頁或視窗，或是要讓擷取頁面保持焦點。

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");
}

詳情請參閱「透過條件式專注模式改善螢幕分享功能」。

不播放本機音訊

同事常會聚集在會議室，當其中一位同事透過筆記型電腦進行簡報，並搭配專用螢幕和喇叭，就能透過會議室中的會議解決方案進行簡報。簡報者通常會將自己的筆記型電腦設為靜音，並使用音量較高的外部喇叭，確保音訊與視訊保持同步。suppressLocalAudioPlayback 音訊限制可節省時間。設定為 true 時，表示瀏覽器應在擷取開始時停止將音訊轉送至本機喇叭。這項限制的預設值為 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

截至本文撰寫時為止，suppressLocalAudioPlayback 不支援 applyConstraints()。請參閱 bug 1381959。

特別銘謝

感謝 Rachel Andrew 審查這份文件。