时间戳

首页 > 解决方案 > 如何在 HTML5 中模拟网络摄像头的存在？

javascript - 如何在 HTML5 中模拟网络摄像头的存在？

问题描述

我正在开发一个 Angular 7 应用程序，它可以从电脑上的手机摄像头或网络摄像头拍摄照片。但是我的一台工作机器没有网络摄像头。因此，我想模拟相机的存在。

理想情况下，我想从视频文件、图像文件列表、单个图像或最后的空假图像中模拟它。

我已经在使用来自“ngx-webcam”的 WebcamModule，但这不是强制性的。

实际的 HTML 代码如下所示：

<!-- in component.html -->
  <webcam [height]="500" [width]="500" [trigger]="triggerObservable" (imageCapture)="handleImage($event)"
    *ngIf="showWebcam" [allowCameraSwitch]="allowCameraSwitch" [switchCamera]="nextWebcamObservable"
    [videoOptions]="videoOptions" (cameraSwitched)="cameraWasSwitched($event)" (initError)="handleInitError($event)">
  </webcam>
  <br />

  <button mat-icon-button (click)="triggerSnapshot();">
    <mat-icon>camera</mat-icon>
  </button>
  <button mat-icon-button (click)="showNextWebcam(true);">
    <mat-icon>switch_camera</mat-icon>
  </button>

并且基于https://stackblitz.com/edit/ngx-webcam-demo

:)

标签： javascriptangularhtmltypescripthtml5-video

解决方案

目前，与@nullptr.t 的想法相同，我正在使用基于video4linux2 的github.com/jremmons/pyfakewebcam。它允许使用 python 生成的流生成任意摄像机（/dev/video0、/dev/video1、...）。

推荐阅读