Javascript 是否可以在一个或多个摄像头的Html页面上嵌入两个网络摄像头流。

我试图在一个HTML页面上嵌入两个网络摄像头流

我习惯于获取从该站点获取的用户媒体脚本

它对一个steam很好，但当我尝试在同一页上制作两个不同的视频流时，它就不起作用了

我试着制作一个带有网格的div标签，并在每个单元格中放置一个视频元素。这只会产生一个流

这是我最近的一次尝试

显示网络摄像头流
#容器{
保证金：0px自动；
宽度：500px；
身高：375px；
边框：10px#333实心；
}
#视频元素{
宽度：500px；
身高：375px；
背景色：#666；
}
#集装箱2{
保证金：0px自动；
宽度：500px；
身高：375px；
边框：10px#333实心；
}
#视频元素2{
宽度：500px；
身高：375px；
背景色：#666；
}
var video=document.querySelector（“#videoElement”）；
navigator.getUserMedia=navigator.getUserMedia | | navigator.webkitGetUserMedia | | navigator.mozGetUserMedia | | navigator.msGetUserMedia | | navigator.oGetUserMedia；
if（navigator.getUserMedia）{
navigator.getUserMedia({
视频：真的
}，handleVideo，videoError）；
} 
函数handleVideo（流）{
video.src=window.URL.createObjectURL（流）；
} 
函数videoError（e）{//执行某些操作
}

通过设置

src

属性，告诉

视频

元素播放哪个

流

基本上，您需要在这里复制所有支持

videoElement

的代码，而不仅仅是它的创建

您将遇到的一个问题是，许多浏览器不赞成同时调用两次

getUserMedia

（在上一次异步调用完成之前），因为这会让用户一次收到多个提示。要解决这个问题，请在

handleVideo

中调用第二个

getUserMedia

，一次只给用户一个提示

您将遇到的第三个问题是，只有Firefox在权限提示中具有内置设备选择，因此在Chrome上，您将获得两次相同的摄像头

要在其他浏览器上运行此功能，您需要

枚举设备

。我有

---

最后，大多数智能手机都有硬件限制，不能同时运行两个摄像头。

你的脚本引用了

videoElement

，但不是

videoElement2

…我并不是说你不能，但如果你可以的话，这将是一个新闻，对我来说有点惊讶。上次我听说，你几乎不能选择一个或另一个…@jball我怎样才能纠正这个问题？你如何选择第二个摄像头？@SebastiánEspinosa必须连接一个摄像头。当浏览器要求您访问相机时，会出现一个下拉列表，您可以在其中选择相机。它与Firefox配合使用效果最好。