我目前正在开发一款可以在我的 Angular 应用程序中录制视频的相机。目前，使用以下代码，我可以访问我的相机并拍摄快照。
有人可以建议我应该在我的代码中修改什么以便能够拍摄视频吗？
App.module.ts 文件:
import {WebcamModule} from 'ngx-webcam';
...
imports: [
...
WebcamModule
]
app.component.ts 文件:
import {WebcamImage} from 'ngx-webcam';
import {Subject, Observable} from 'rxjs';
...
export class AppComponent {
...
// latest snapshot
public webcamImage: WebcamImage = null;
// webcam snapshot trigger
private trigger: Subject<void> = new Subject<void>();
triggerSnapshot(): void {
this.trigger.next();
}
handleImage(webcamImage: WebcamImage): void {
console.info('received webcam image', webcamImage);
this.webcamImage = webcamImage;
}
public get triggerObservable(): Observable<void> {
return this.trigger.asObservable();
}
}
app.component.html 文件:
<webcam [height]="500" [width]="500" [trigger]="triggerObservable" (imageCapture)="handleImage($event)"></webcam>
<!-- Button Takes Photo -->
<button class="actionBtn" (click)="triggerSnapshot();">Take A Snapshot</button>
<!-- Snapshot Div where image will be shown -->
<div class="snapshot" *ngIf="webcamImage">
<h2>Take your image or get another</h2>
<img [src]="webcamImage.imageAsDataUrl"/>
</div>
最佳答案
ngx-webcam 还不支持开箱即用的录制。 https://github.com/basst314/ngx-webcam/issues/38 它的内置功能
- 网络摄像头实时取景
- 拍照
- 现代操作系统的智能手机兼容性(操作系统必须支持 WebRTC/UserMedia API)
- 访问前置和后置摄像头(如果存在多个摄像头)
- 智能手机上的纵向和横向模式
- 面向用户的摄像头的镜像实时取景 - 手机上的“自拍 View ”
- 捕获无损像素图像数据以进行更好的后期处理。 我建议研究不同的包或方法。
- how to record the video through webcam using javascript 您可能最终不得不降低级别并构建自己的解决方案。
- https://developers.google.com/web/fundamentals/media/recording-video
关于angular - 如何使用 ngx-webcam 在 Angular 中录制视频 - 捕获照片有效，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/62959304/