MediaRecorder Chrome编解码器/容器无法在Mobile或Safari上播放

编程问答 2022-06-03

问题描述

目标：使用MediaRecorder（或其他）api生成可在跨平台查看的视频文件。

失败：当前api退回到Google chrome上的容器/编解码器，该容器/编解码器仅在chrome和高级桌面媒体播放器上可见，而在Safari或移动设备上则不可见。

！在safari中运行时，相同的代码会在所有平台上生成有效的视频文件。

    const mimeType = 'video/webm;codecs=H264'
    rec = new MediaRecorder(stream.current,{ mimeType })
    rec.ondataavailable = e => blobs.push(e.data)
    rec.onstop = async () => {
      savetoFile(new Blob(blobs,{ type: mimeType }))
    }

尝试了容器和编解码器的所有不同组合。 还尝试使用MP4文件容器覆盖Blob的mimeType。 没有成功。

也尝试过：

https://github.com/streamproc/MediaStreamRecorder

https://github.com/muaz-khan/RecordRTC

相同的问题。我似乎chrome的容器/编解码器组合总是退回到只能在chrome或功能强大的桌面视频播放器（例如vlc）上才能查看的格式。

enter image description here

对我而言，唯一的跨平台工作示例是从safari浏览器中获取的示例，并且是上图中从左数第五的示例。

问题：

编辑- （我们不允许在问题中寻求有关书籍，工具，软件库等的建议。请对问题进行编辑，以便可以通过事实和引用予以回答）

在MediaCapture api中使用什么正确的容器/编码来使输出文件可跨平台播放？

解决方法

我们有同样的问题。我们尝试了许多不同的组合，但始终会回退到matroska

codecgoogle-chromemediarecorderwebrtc