MediaRecorder无法产生有效的WebM文件

编程问答 2022-06-10

问题描述

MediaRecorder.isTypeSupported()为{video / webm'，'video / webm; codecs = avc1'和'video / webm; codecs = vp9'返回true。

但是，只有mimeType ='video / webm; codecs = vp9'会生成有效的webm文件（'video / webm; codecs = vp9，opus'）。

将mimeType设置为“ video / webm”和“ video / webm; codecs = avc1”会产生“ video / x-matroska; codecs = avc1，opus”文件，这不是有效的webm视频。

这是MediaRecorder错误，Chrome错误还是我遗漏了某些东西？\

软件：Chrome 85，MacOS 10.15。我没有在Windows或Linux上尝试过。

解决方法

However,only mimeType='video/webm;codecs=vp9' results in a valid webm file.
Is this a MediaRecorder bug,Chrome bug or am I missing something?

WebM 是VP8和VP9视频编解码器的正确的A / V媒体容器。

AVC1 视频编解码器属于MPEG容器（.mp4，.m4v）。
该视频编解码器也可以包含在MKV媒体文件（Matroska .mkv）中。

,

复制：

const wantMimeType = 'video/webm;codecs=h264,opus';
if (MediaRecorder.isTypeSupported(wantMimeType)) {
  let mediaRecorder = new MediaRecorder(stream,{
    mimeType: wantMimeType,});
  // ...drive the recorder
  mediaRecorder.onstop = (event) => {
    try {
      // returns 'video/x-matroska;codecs=avc1,opus' in Chrome,// and the binary file content also says Matroska instead of WebM
      let mimetype = mediaRecorder.mimeType;
      if (!mimeType.startsWith('video/webm')) {
        throw new Error(`We requested "${wantMimeType},but the browser gave us "${mediaRecorder.mimeType}"`);
      }
      let blob = new Blob(chunks,{ type: mimeType });
      // ...convert to data: URL
      // ...play it in <video src="data:..."> // won't work,if Matroska
    } catch (ex) {
      alert(ex);
    }
  };
}

观察：

  1. Chrome 响应 true 到 isTypeSupported('video/webm;codecs=h264,opus')，但 Chrome 实际上不支持这种组合，即响应实际上不正确并且违背了 {{ 1}}。

  2. Chrome 忽略我们在 isTypeSupported() 构造函数中传递的 mimetype，而是返回 MediaRecorder。这将不起作用，因为 video/x-matroska;codecs=avc1,opus 不会播放 Matroska mimetype。

2 个解决方案：

  • Hacky：录制后，只需将 mimetype 改回 <video>。文件内容仍会显示“Matroska”，但 Chrome 上的 video/webm;codecs=h264,opus 会播放它。这是一个糟糕的解决方案，因为我们传入了错误的 mimetype，它与内容不匹配。其他软件 - 或更高版本的 Chrome - 可能会破坏它。
  • 正确：不要使用 H.264，而是使用 VP9 或 VP8。 Chrome 两者都支持，Firefox 支持 VP8，它们都可以正常工作。作为奖励，它们是开放的，而 H.264 则充斥着软件专利。根据硬件编码器的实现，VP8/9 也可能提供更好的图像质量结果。
google-chromematroskamediarecordermediarecordervideovideowebmwebm