如何在 Chrome 浏览器中从 MediaStream 制作 mp4答案

【问题标题】：How to make mp4 from MediaStream in Chrome browser如何在 Chrome 浏览器中从 MediaStream 制作 mp4
【发布时间】：2017-07-07 09:08:51
【问题描述】：

MediaRecorder.isTypeSupported('video/mp4') 在 Chrome 中是 false。所以我找到了MediaStreamRecorder https://github.com/streamproc/MediaStreamRecorder 然后我找到了

var recorder = new MediaStreamRecorder(stream, {
  mimeType: 'video/mp4',
});
// also
recorder.mimeType = 'video/mp4';

但输出是webm，因为我检查了ffmpeg -i

Input #0, matroska,webm, from '/Users/otiai10/Downloads/example.mp4':
  Metadata:
    encoder         : Chrome
  Duration: N/A, start: 0.000000, bitrate: N/A
    Stream #0:0(eng): Video: vp8, yuv420p, 640x480, SAR 1:1 DAR 4:3, 30 fps, 30 tbr, 1k tbn, 1k tbc (default)

视频可以在 Chrome 中播放，但不能在 QuickTime Player 上播放。

Here 是这个问题的更多细节和（不是！）工作示例。

据说muaz-khan/Ffmpeg.js可以把webm转成mp4，但是文件大小很重要。

是否有任何解决方法可以录制并保存为 mp4？

【问题讨论】：

标签： javascript google-chrome ffmpeg mediarecorder

【解决方案1】：

好吧，那是我的误会。

https://github.com/streamproc/MediaStreamRecorder

MediaStreamRecorder 可以在 Chrome 上将音频录制为 WAV，将视频录制为 WebM 或动画 gif

没有 mp4 可能。

【讨论】：

今天仍然如此吗？感谢分享！
@Crashalot 是的，它仍然是真的。
ios 11 没有内置媒体记录器呢？

【解决方案2】：

虽然无法直接在mp4 中记录，但您可以将生成的webm 文件传递给webm-to-mp4 进行转换：

const webmToMp4 = require("webm-to-mp4")
 
const mp4 = webmToMp4(webm)

该模块可以编译为在浏览器中工作，因为它在后台使用ffmpeg.js。

【讨论】：

这是一个有趣的概念。你知道这个的任何实现吗？（直接在客户端浏览器上编码 mp4）？
这实现了一个浏览器友好的 ffmpeg 构建，以便它可以在浏览器中工作。

【解决方案3】：

结帐ffmpeg.wasm

您可以通过以下方式安装它：

# Use npm
$ npm install @ffmpeg/ffmpeg @ffmpeg/core
# Use yarn
$ yarn add @ffmpeg/ffmpeg @ffmpeg/core

然后，您可以将 blob 转换为 mp4 文件。查看他们在我分享的链接中提供的示例。

【讨论】：

我们需要将 mediStream 转换为 mp4 ，mediaStream 与 blob 不同
@ghazalehjavaheri 据我所知，目前无法直接从 mediaStream 获取 mp4。