使用getUserMedia从多个网络摄像头中捕获视频

Question

我希望能够从连接到我的电脑上的多个网络摄像头中捕获视频。使用一个网络摄像头已经足够简单，但是如何从多个摄像头获取视频流呢？ 是否可以选择一台摄像机用于一个流？

     navigator.getUserMedia ({
         video: true 
     }, function (oMedia) {
         var video = document.getElementById ('tVideo1'); 
         video.src = window.URL.createObjectURL (oMedia); 
     }); 

- user3205962

Answer 1

我对你的问题很感兴趣，所以开始研究“getusermedia多个摄像头”的相关内容。经过几个小时的研究，当我几乎要放弃时，我发现了这个谷歌小组的讨论。我回顾了一下你的问题，看看你的目标是所有网络摄像头的流应该同时出现还是你想为用户提供选择摄像头源的选项。看起来你想让用户选择源。如果是后者情况，在上面的链接中，Vikas（在他2013年8月15日的消息中）描述了一种实现这一点的方法。你需要启用WebRTC枚举源标志，然后使用MediaStreamTrack.getSources获取所有源并将sourceId传递给getUserMedia，例如navigator.getUserMedia（{"video"：{optional：[{sourceId："---YOUR ID HERE---"}]}}, fun，errfun）;。似乎其中一个用户已经成功地使其工作。

这里是我看到的源代码。 这些信息只适用于Chrome canary或Firefox。我想分享一下，以防您还没有遇到过这种情况，这可能会对您有所帮助。我已经实现了一个应用程序，在单个屏幕上有多个网络摄像头。但由于它是桌面应用程序，所以更加简单。

- skolte

Answer 2

您需要使用getSources API，但很遗憾它的支持并不是很好。我认为Chrome有一个版本可以通过配置标志隐藏，但除此之外，您只能等待了。

我知道这不是您想听到的答案，很抱歉。

- Ian Devlin

Answer 3

您可以使用弹出窗口同时捕获多个视频流。我只有一台相机，所以无法测试这个解决方案。在Chrome浏览器中，我想用户可以在每个子窗口的地址栏中单击摄像机图标来选择独立源。Firefox浏览器会在请求使用设备时询问您要使用哪个摄像头，所以甚至可以尝试在Firefox浏览器中使用iframes而不是弹出窗口。

- Nathan Breit