WebRTC/WebSocket屏幕录制

在我的用例中，我希望记录屏幕活动并将其发送到服务器[非实时]。我看了一些博客/示例演示。但我找不到任何与此相关的东西。我可以找到很多实时流媒体音频/视频，但没有屏幕录制

我有以下与此相关的问题

• 对于这个用例，哪一个是有效的WebRTC/Websockets
• 对WebRTC/Websockets的浏览器支持
• 有没有其他方法来实现这个用例

我是WebRTC/Websockets的新手，如果我没有发布足够的信息，请发表评论。我要补充一点

---

有人能帮我吗？任何与此用例相关的参考URL/任何相关信息都会非常有用

解决方案可分为三部分：

• 使用getUserMedia获得screen mediastream，这属于WebRTC类别，由于您要共享screen，您的站点必须是

  https

  ，并且您的用户可能需要使用扩展（对于firefox和chrome），您可以查看演示

• 在录制媒体流时，firefox已经支持它一段时间了，chrome从47年开始支持它。因此，使用mediarecorder，您可以获得录制文件的blob

• 如何将此blob发布到服务器完全取决于您，您可以使用任何通道：websockets、http post等。您可以将服务器设置为WebRTC客户端，并通过RTCDataChannel发送，但对于您的用例来说，猜测这将是过分的

---

正如@mido所建议的，在客户端我将使用MediaRecorder API。另一种选择是在服务器端进行记录。对于后一个选项，您可以使用一些开源媒体服务器，如[Kurento]（）。

以下是如何在Firefox中录制屏幕（更新：试用）：

var约束={video:{mediaSource:“屏幕”，宽度：320，高度：200}；
var start=ms=>navigator.mediaDevices.getUserMedia（约束）
.然后（流=>记录（流，毫秒）
。然后（录制=>{
停（流）；
video.src=link.href=URL.createObjectURL（新Blob（录制））；
link.download=“recording.blob”；
link.innerHTML=“下载blob”；
日志（“播放”+录制[0]。键入+“录制：”）；
})
.catch（log）。然后（（）=>stop（stream）））
.渔获物（原木）；
var记录=（流，毫秒）=>{
var rec=新的媒体记录器（流），数据=[]；
rec.ondataavailable=e=>data.push（e.data）；
rec.start（）；
日志（记录状态+”表示“+（ms/1000）+”秒…）；
var停止=新承诺（（r，e）=>（rec.onstop=r，rec.onerror=e））；
返回Promise.all（[停止，等待（毫秒）。然后（（）=>rec.stop（））]）
。然后（（）=>数据）；
};
var stop=stream=>stream.getTracks（）.forEach（track=>track.stop（））；
var wait=ms=>newpromise（resolve=>setTimeout（resolve，ms））；
var log=msg=>div.innerHTML+=“
”+msg
记录屏幕！


谢谢。这真的很有帮助。如何记录整个屏幕，这不仅意味着firefox或任何其他浏览器窗口，我还想记录最终用户的整个屏幕。@vaishali您是否查看了演示的链接（在第一点中）谢谢。是否有其他服务器端录制工具？我只想找到最好的。我对这一领域相当陌生。@DineShappawoo，你也可以尝试一下，另一个开源项目，顺便说一句，它在It领域有着重要的活动，帮助很大。是否可以在localhost（我是说没有https）中测试此问题？@Dany，是的，但前提是您将
、localhost
添加到域列表中，并在about:config中将
media.navigator.permission.disabled
设置为
true
。后者将关闭所有getUserMedia权限，因此您可能希望在测试后将其设置回原来的状态。这将从相机记录一些时间reason@JimmyKane如前所述，仅在Firefox中有效。另请参见。@jib Right！谢谢你的编辑。也可能值得一提