上QQ阅读APP看书,第一时间看更新
2.4.3 共享屏幕
调用MediaDevices.getDisplayMedia()方法获取共享屏幕流,该方法弹出提示框,提示用户授权并选择屏幕内容。
const promise = navigator.mediaDevices.getDisplayMedia(constraints);
- 参数:constraints,可选参数,MediaStreamConstraints约束对象,用于指定共享屏幕的约束需求。
- 返回值:pomise,如果调用成功则得到媒体流;如果调用失败,则返回一个DOMEx-ception对象,异常说明如表2-9所示。
表2-9 getDisplayMedia()异常说明
屏幕共享有可能泄露用户的隐私,出于安全考虑,WebRTC规定:
1)每次调用getDisplayMedia()方法都要弹出授权提示框,如果通过了授权,则不保存授权状态;
2)getDisplayMedia()方法必须由用户触发,且当前的document上下文处于激活状态。
代码清单2-34使用了async/await语法获取共享屏幕流,displayMediaOptions是一个MediaStreamConstraints对象,指定了约束需求,如果调用成功则返回captureStream;如果调用失败则打印错误信息。
代码清单2-34 getDisplayMedia()方法示例
async function startCapture(displayMediaOptions) { let captureStream = null; try { captureStream = await navigator.mediaDevices.getDisplayMedia(displayMediaOptions); } catch(err) { console.error("Error: " + err); } return captureStream; }