MediaRecorder: start() 方法

Baseline 已广泛支持

此特性已得到良好支持,可在多种设备和浏览器版本上使用。自 2021 年 4 月起,所有浏览器均已支持此特性。

MediaRecorder 接口的 start() 方法开始将媒体录制到一个或多个 Blob 对象中。

您可以将媒体的整个持续时间录制到一个单独的 Blob 中(或者直到调用 requestData()),也可以指定每次录制的毫秒数。然后,每当录制完指定时长的媒体后,都会触发一个事件,让您对已录制的媒体进行操作,同时会创建一个新的 Blob 来录制下一段媒体。

假设 MediaRecorderstateinactivestart() 会将 state 设置为 recording,然后开始从输入流捕获媒体。此时会创建一个 Blob,并将数据收集到其中,直到时间切片周期结束或源媒体结束。每次 Blob 填满到该点(timeslice 持续时间或在未提供 slice duration 时到媒体结束),一个 dataavailable 事件会携带录制的数据发送到 MediaRecorder。如果源仍在播放,则会创建一个新的 Blob 并继续录制到其中,依此类推。

当源流结束时,state 被设置为 inactive,数据收集停止。一个最终的 dataavailable 事件会被发送到 MediaRecorder,之后会发送一个 stop 事件。

注意: 如果浏览器无法开始录制或继续录制,它将抛出一个 error 事件,随后发送一个包含已收集 Blobdataavailable 事件,最后发送 stop 事件。

语法

js
start()
start(timeslice)

参数

timeslice 可选

每次录制到 Blob 中的毫秒数。如果未包含此参数,则会将整个媒体时长录制到单个 Blob 中,除非调用 requestData() 方法来获取 Blob 并触发创建新的 Blob 以继续录制媒体。

注意: 与 Web API 中的其他时间值一样,timeslice 并非精确值,由于创建下一个 blob 之前的其他待处理任务,实际间隔可能会稍长。

返回值

无(undefined)。

异常

可以立即检测到的错误会作为 DOM 异常抛出。所有其他错误都会通过发送到 MediaRecorder 对象的 error 事件报告。您可以实现 onerror 事件处理程序来响应这些错误。

InvalidStateError DOMException

如果 MediaRecorder 不处于 inactive 状态,则会抛出此异常;如果媒体已在录制中,则无法开始录制。请参阅 state 属性。

NotSupportedError DOMException

在以下情况下抛出

  • 您尝试录制的媒体流不活跃。
  • 流的一个或多个轨道格式无法使用当前配置进行录制。
  • 在创建 MediaRecorder 时同时指定了 videoKeyFrameIntervalDurationvideoKeyFrameIntervalCount 参数。
SecurityError DOMException

如果 MediaStream 配置为不允许录制,则会抛出此异常。例如,使用 getUserMedia() 获取的源,当用户拒绝使用输入设备的权限时,可能会出现这种情况。如果源媒体的安全选项在录制开始后发生更改,此异常也可能作为 error 事件传递。

示例

js
record.onclick = () => {
  mediaRecorder.start();
  console.log("recorder started");
};

规范

规范
MediaStream Recording
# dom-mediarecorder-start

浏览器兼容性

另见