求助:getUserMedia展示本机摄像头只能展示两个吗?为什么第三个会报错?-灵析社区

云卿山手

navigator.mediaDevices.getUserMedia 方法最多只能获取两个摄像头数据吗? 这边有一个设备有三个摄像头。使用navigator.mediaDevices.enumerateDevices方法获取到设备列表之后,循环调用getUserMedia,结果就是前两个可以展示在video标签中,第三个调用getUserMedia时会报错:DOMException: Could not start video source。 调整过展示顺序,三个摄像头的确没问题,谁第三个加载谁就不行。 html中有三个video标签,id分别是v0,v1,v2。 下面是js的调试代码。第三个getUserMedia会报错。好无奈啊。 export default { data(){ return { } }, mounted(){ this.test(); }, methods:{ async test(){ let arr = await navigator.mediaDevices.enumerateDevices(); console.log(arr); let list = []; for(let i=0;i{ let element1 = document.getElementById("v0"); element1.srcObject = stram; }).catch((e)=>{ console.log('Error',list[0],e) }); navigator.mediaDevices.getUserMedia(list[1]).then((stram)=>{ let element2 = document.getElementById("v1"); element2.srcObject = stram; }).catch((e)=>{ console.log('Error',list[1],e) }); navigator.mediaDevices.getUserMedia(list[2]).then((stram)=>{ let element3 = document.getElementById("v2"); element3.srcObject = stram; }).catch((e)=>{ console.log('Error',list[2],e) }); }, } } ![](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240920/c3c406c1717815c1e15bddb5979402ec.png)

阅读量:136

点赞量:0

问AI
export default { data(){ return {} }, mounted(){ this.test(); }, methods:{ async test(){ let devices = await navigator.mediaDevices.enumerateDevices(); console.log(devices); let videoInputs = devices.filter(device => device.kind === 'videoinput'); if (videoInputs.length { try { let stream = await navigator.mediaDevices.getUserMedia({ video: { deviceId } }); document.getElementById(elementId).srcObject = stream; } catch (error) { console.log(`Error accessing video input ${deviceId}:`, error); } }; await startVideoStream(videoInputs[0].deviceId, 'v0'); await startVideoStream(videoInputs[1].deviceId, 'v1'); await startVideoStream(videoInputs[2].deviceId, 'v2'); }, } }