使用javascript在屏幕上记录浏览器窗口

Question

我正在开发一个应用程序，它基本上是一个可以嵌入交互式模拟的绘图应用程序。

http://test.anybodycanlearn.org/

我正在尝试添加用于在网站上录制屏幕和音频的选项，以便教师可以在线创建课程。实现这一目标的最佳方法是什么？我在互联网上搜索了很多，发现了由Muaz Khan撰写的recordRTC https://www.webrtc-experiment.com/RecordRTC/ 是一个非常好的选择。但我是一个noobie，我觉得它有太多的选择，我不确定哪个是我最好的选择。我也读过关于webRTC的文章。是否可以使用它进行屏幕记录？我不介意使用chrome扩展，只要我可以选择用它来记录页面的特定部分。请帮帮....

Answer 1

截至2018年5月，您可以使用

获取 Firefox 中的屏幕视频流

let constraints = {
  video: {
    mediaSource: "screen"
  }
};

navigator.mediaDevices.getUserMedia(constraints)
  .then(mediaStream => {
    // do something with mediaStream now
  });

但是，这实际上记录屏幕。你需要建立一种方法来自己做。一种方法是使用WebRTC将您获得的视频发送到后端并将其记录在那里。

就其他浏览器而言：

• Chrome 不支持原生获取屏幕媒体。您必须构建扩展程序并要求用户安装它。这不是很难做到。
• Edge＆amp;野生动物园应该支持它，但我当时没有尝试过。

Answer 2

您可以检查此库videojs-record。使用RecordRtc构建。 您还可以将其与React和Angular等流行的js框架一起使用。