网络摄像头在某些机器上无法使用 JavaScript

Question

我正在使用 Vue.js 构建一个使用网络摄像头的 Electron 应用程序。网络摄像头在一台计算机上的 Electron 应用程序中工作，但它只是在另一台计算机上显示黑屏。唯一显着的区别（我认为）是它工作的机器（机器 A）使用节点 v14.15.0 而在它不工作的机器（机器 B）上使用 v12.18.4

我单独在机器B上测试了网络摄像头。它通过 windows 和 online tool 上的本机相机应用程序工作。有趣的是，集成和外部网络摄像头都无法工作。我一开始流，灯就亮了，仅此而已。 .getUserMedia() 的承诺似乎没有解决（请参阅代码片段），但我无法确定原因。

如何让网络摄像头流式传输？

  let mediaInputs = [];
  let devices = [];

  if (!navigator.mediaDevices || !navigator.mediaDevices.enumerateDevices) {
    console.log("enumerateDevices() not supported.");
    return;
  }

  mediaInputs = await navigator.mediaDevices.enumerateDevices();
  devices = await mediaInputs.filter(
    (device) => device.kind === "videoinput"
  );

       //Stop any existing streams
  if (this.video.srcObject !== undefined) {
    const l = this.video.srcObject;
    l.getTracks().forEach((track) => track.stop());
  }

  const sourceInfo = this.videoSources.find((o) => o.label === this.source);
  const constraints = {
    video: {
      deviceId: sourceInfo.deviceId,
      width: 1280, 
      height: 720,
    },
    audio: false,
  };
  try {
    console.log('This line is logged');
    //This is where I start the stream.

    const stream = await navigator.mediaDevices.getUserMedia(constraints); 
    console.log('This line is never reached');
    this.video = this.$refs.video; 
    this.video.srcObject = stream;
    this.video.play();
  } catch (error) {
    this.showSnackbar(error);
    console.error(error);
  }

Answer 1

我只需要更新到最新版本的 Electron（在撰写本文时为 11.1.1）才能正常工作。

但是，如果您仍然遇到问题，GitHub thread 关于该主题的

仍然有效

网络摄像头在某些机器上无法使用 JavaScript

Webcam not working with JavaScript on some machines

vue.js

electron

webcam