1

这是一个奇怪的问题。目前，我在 Web 应用程序中使用 react-webcam 组件（ https://www.npmjs.com/package/react-webcam ）来显示来自 USB 5MP 摄像头的实时视频。这是组件代码：

    import React from "react";
    import Webcam from "react-webcam";
    import null_camera from "./placeholder.jpg";
    import { CardMedia } from "@mui/material";

    export default function WebcamCapture({ cameraCode }) {
    const webcamRef = React.useRef(null);
    const video = {
    width: 900,
    height: 275,
    facingMode: "user",
    deviceId: cameraCode,
    };

    const videoImage = {
    width: 900,
    height: 275,
    facingMode: "user",
    };

    if (cameraCode != undefined) {
    return (
      <div className="webcam-container" style={{ marginBottom: -5 }}>
        <Webcam
          audio={false}
          ref={webcamRef}
          screenshotFormat="image/jpeg"
          videoConstraints={video}
        />
      </div>
    );
    } else {
    return (
      <div className="webcam-container" style={{ marginBottom: -5 }}>
        <CardMedia component="img" height="275" image={null_camera} />
      </div>
    );
    }
    }

这里的想法是显示来自机器人的摄像头馈送，如果未插入摄像头，则显示（没有可检测到的摄像头）的图像。当通过 USB 插入相机时，所有这些都可以正常工作。现在机器人需要一根 50 英尺长的支撑线，所以我们不得不购买一根 50 英尺的 USB 2.0 电缆，中间有一个放大器/中继器。这就是它变得奇怪的地方。使用电缆打开带有组件代码的 Web 应用程序，我的 fps 就像 1/s，但是如果我在 webapp 代码运行时打开 photobooth，我的 fps 在我关闭 photobooth 行为后跳到被认为正常或可接受的水平在一段时间内保持不变。

我相信 photobooth 正在后端打开一些优化视频算法，从而提高 fps。一旦该程序在后端死机，我就会回到可怕的 fps。

对于这个问题，我可以在反应前端或网络摄像头组件中做些什么来复制这个 photobooth 过程。我不知道我可以在我的反应组件中实现与 photobooth 相同的行为。

4

0 回答 0