Screen Capture with getDisplayMe

2018-05-04 本文已影响230人耦耦

1、getUserMedia与getDisplayMedia*比较

除了下面提到的几点，其他操作，两者是相同的。

getUserMedia

获取的mediaStream可以包括例如视频轨道（由硬件或虚拟视频源如相机，视频记录设备，屏幕共享服务等产生），音频轨道（类似地，由物理或虚拟音频源如麦克风，A / D转换器等）以及可能的其他轨道类型。
接受MediaStreamConstraints约束参数对捕获的mediaStream进行限制。

getDisplayMedia

从显示设备获取媒体之外
并且constraints参数不接受MediaTrackConstraints 值。不能实现约束。
该MediaStream对象将只有一个MediaStreamTrack用于捕获的视频流; 没有MediaStreamTrack对应于捕获的音频流。
不能保持权限。当选择完要分享的屏幕或窗口后，就不能更改了，除非刷新页面，重新惊醒Scrren Capture
image.png

2、getDisplayMedia例子

navigator.getDisplayMedia({ video: true })
  .then(stream => {
    // we have a stream, attach it to a feedback video element
    videoElement.srcObject = stream;
  }, error => {
    console.log("Unable to acquire screen capture", error);
  });

3、用户权限

调用getDisplayMedia()需要一个HTTPS源。
当调用getDisplayMedia()时，提示用户允许或拒绝允许屏幕捕获。
当用户选择的权限持续存在时，捕获选择器UI将出现在每个getDisplayMedia()调用中。权限可以通过微软Edvices中的站点权限UI（在URL栏中设置或通过站点信息面板）来管理。
如果一个网页从iframe调用getDisplayMedia()，我们将根据自己的URL单独管理屏幕捕获设备许可。在iframe来自其父网页的不同域的情况下，这为用户提供了保护。
如上所述，不允许MediaStreamConstraints限制影响getDisplayMedia屏幕捕获源的选择。