使用MediaRecorder将音频和视频流合并为一个文件

Question

我正在制作一个小型交互式动画/游戏（使用PixiJS在画布上），希望为用户提供保存渲染动画的选项。经过研究，MediaRecorder似乎是我用来记录和呈现视频的API。但是，MediaRecorder构造函数仅允许将一个流用作源。

如何合并其他流（音频效果），以​​便录制的视频文件中也有声音？

Answer 1

使用视频流的轨道和音频流的轨道创建新的（组合）媒体流。为此，请使用MediaStream constructor：

let combined = new MediaStream([...videoStream.getTracks(), ...audioStream.getTracks()]);
let recorder = new MediaRecorder(combined);

即使每个流中可能只有一个轨道，但是如果每个流中都有多个轨道，这也将起作用。

选择某些频道

当然，如果要丢弃视频流的所有音频轨道和音频流的视频轨道，

let combined = new MediaStream([...videoStream.getVideoTracks(), ...audioStream.getAudioTracks()]);