MediaRecorder.requestFrame
收藏
我的收藏

基础库 2.52.0 开始支持本方法,低版本需做兼容处理,这是一个同步方法。

手动模式中主动录制当前 Canvas 上的当前画面到视频帧中,仅在手动模式中生效。

语法

MediaRecorder.requestFrame()

参数说明

返回值

扫码体验

请使用字节宿主APP扫码

代码示例

<canvas id="myCanvas" canvas-id="myCanvas" type="2d"> </canvas>
<button type="primary" bindtap="requestFrame">手动录制</button>
Page({
  async onReady() {
    tt.createSelectorQuery()
      .select("#myCanvas")
      .node()
      .exec((res) => {
        // 获取 canvas 实例
        const canvas = res[0].node;
        const canvasCtx = canvas.getContext("2d");
        this.recorder = tt.createMediaRecorder(canvas, {
          width: canvas.width, // video width​
          height: canvas.height, // video height​
          videoBitsPerSecond: 1000, // bit rate in kbps​
          gop: 12, // key frame interval​
          fps: 0,​
        });
  },

  requestFrame() {
    this.recorder.requestFrame();
  }
})

Bug & Tip