Video.js 和 Videojs-record - 要求按下按钮开始录制

Video.js and Videojs-record - requirement to press buttons to start recording

我继承了一个使用 video.js and videojs-record

的项目

在我继承的项目中,应用程序的用户在开始录制之前需要点击两次 - 第一次是在播放器中间的相机图标上,第二次是在圆圈上 'record'左下角的按钮。 (也有第一次接受权限的要求,但我个人并不担心这个要求,因为我理解它的必要性)。

但实际上,对于我的用例,我不想要求用户单击任何内容进行记录。一旦接受权限,我想通过 javascript 以编程方式开始录制。

But even all the examples have the user required to click those two buttons, so I'm starting to think there's no way around it. I looked through all the options 我找不到任何相关信息。我看到函数 startstop 但是当我执行 player.start()player.stop() 时它说未定义。

要启动设备,请使用 player.record().start()

HTML:

<div class="video-js">
    <button (click)="startRecording()" class="btn btn-primary">Start</button>
    <button (click)="stopRecording()" class="btn btn-warn">Stop</button>

    <video id="video_{{idx}}" class="video-js vjs-default-skin"></video>
</div>

共享屏幕并启动记录器:

startRecording(){
        this.player.record().getDevice();
    }

停止记录器:

stopRecording(){
        this.player.record().stop();
    }

AfterViewInit:

ngAfterViewInit() {
      ....

      // device is ready
      this.player.on('deviceReady', () => {
        console.log('device is ready!');
        this.player.record().start(); // <-- IMPORTANT*
      });
  
      // user clicked the record button and started recording
      this.player.on('startRecord', () => {
        console.log('started recording!');
      });
  
      // user completed recording and stream is available
      this.player.on('finishRecord', () => {
        // show save as dialog
        console.log('finished recording: ', this.player.recordedData);
        this.player.record().saveAs({'video': 'my-video-file-name.webm'});
    });
  
      ....
    }

我指定了一行IMPORTANT*,这行对于启动录像机很重要,否则只会启动屏幕共享。

你的HTML

<button class="btn btn-primary" (click)="startRecord()">Start</button>
<button (click)="camOn()" class="btn btn-primary">i am ready</button>
<button (click)="stopRecording()" class="btn btn-warn">Stop</button>

TS/JS

startRecord() {
this.player.record().start();
}
camOn() {
this.player.record().getDevice();
}
stopRecording() {
this.player.record().stop();
}