在线客服系统音视频功能开发，获取本地屏幕视频媒体流

唯一Chat

发布于 2023-02-28 15:18:16

2820

发布于 2023-02-28 15:18:16

文章被收录于专栏：陶士涵的菜地

为了能够实现共享屏幕，我们第一步需要把屏幕的视频流获取到

现在就通过js来获取到本地屏幕流并展示

要在JavaScript中获取屏幕视频流，您可以使用WebRTC技术中的getDisplayMedia方法。该方法可以在现代浏览器中使用，例如Google Chrome和Mozilla Firefox。

以下是使用getDisplayMedia方法来获取屏幕视频流的示例代码：

html

<video autoplay></video>

// 获取屏幕视频流
navigator.mediaDevices.getDisplayMedia({video: true})
  .then(stream => {
    // 将视频流分配给视频元素
    const videoElement = document.querySelector('video');
    videoElement.srcObject = stream;
  })
  .catch(error => {
    console.error('Error accessing media devices.', error);
  });