Javascript 无法加载html格式的网络摄像头/视频_Javascript_Html_Firefox_Webcam

Javascript 无法加载html格式的网络摄像头/视频

javascript html firefox

Javascript 无法加载html格式的网络摄像头/视频,javascript,html,firefox,webcam,Javascript,Html,Firefox,Webcam,我正在使用一个基本的html/javascript脚本加载一个网络摄像头组件 <html> <head>  <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script> <script src="ht

我正在使用一个基本的html/javascript脚本加载一个网络摄像头组件

<html>
  <head>
    <!-- Load the latest version of TensorFlow.js -->
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/mobilenet"></script>
  </head>
  <body>
    <div id="console"></div>
    <!-- Add an image that we will use to test -->
    <video autoplay playsinline muted id="webcam" width="224" height="224"></video>
    <!-- Load index.js after the content of the page -->
    <script src="index.js"></script>
  </body>
</html>

根据其他答案，这似乎是加载网络摄像头的正确方法。然而，对我来说什么都没有。也没有控制台日志。我正在Firefox上尝试此功能。

首先，只需在html文件的部分包含脚本webcam easy.min.js

并尝试代替js，您将获得web cam输出

const webcamElement = document.getElementById('webcam');

async function app() {
    console.log('Loading mobilenet..');
  
    // Load the model.
    net = await mobilenet.load();
    console.log('Successfully loaded model');
    const webcam = await tf.data.webcam(webcamElement);
    while (true) {
      const img = await webcam.capture();
      const result = await net.classify(img);
  
      document.getElementById('console').innerText = `
        prediction: ${result[0].className}\n
        probability: ${result[0].probability}
      `;
      img.dispose();
      await tf.nextFrame();
    }
  }