เว็บแอปใช้ getDisplayMedia()
เพื่อบันทึกแท็บ หน้าต่าง หรือหน้าจอเป็น MediaStream ได้อยู่แล้ว ใน Chrome 109 คุณจะใช้ประโยชน์จากการปรับปรุงต่อไปนี้ได้
- เมื่อเริ่มการแชร์หน้าจอ โฟกัสแบบมีเงื่อนไขจะอนุญาตให้เว็บแอปจับภาพควบคุมได้ว่าจะให้เบราว์เซอร์โฟกัสแท็บหรือหน้าต่างที่บันทึกไว้หรือไม่ หรือจะให้แท็บจับภาพยังคงทํางานอยู่หรือไม่
- ตัวเลือก
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
กิตติกรรมประกาศ
รูปภาพหลักโดย Brett Jordan
ขอขอบคุณ Rachel Andrew ที่อ่านบทความนี้