如何从字节数组创建示例 webm 文件答案

【问题标题】：How to create a sample webm file from byte array如何从字节数组创建示例 webm 文件
【发布时间】：2018-12-23 16:06:56
【问题描述】：

我正在开发一个屏幕捕获应用程序，并且能够让ondataavailable 事件工作并以块的形式获取数据，我将这些数据进一步转换为 blob，但是当我通过 websocket 将相同的数据流发送到服务器并保存时作为 webm 文件流式传输到磁盘，然后播放该文件，该文件不播放任何内容。我认为该文件需要一些我不确定的元信息。

有什么建议吗？

这是我的 javascript 代码：

socket.emit('message', new Blob([event.data], {type: 'video/webm'}));

服务器保存代码：

fs.writeFile("d://test.webm", data, "binary", function(err) { });

【问题讨论】：

标签： javascript websocket webrtc get-display-media

【解决方案1】：

dataavailable 事件返回一个 chunk——一段录音——并触发多次。一个事件不可能包含整个记录。

将来自多个事件的数据合并到一个chunks 数组中，然后在您停止记录后，将整个数组合并到一个新的Blob 中。这会生成一个适合我的文件：

const rec = new MediaRecorder(stream), chunks = [];
rec.ondataavailable = e => chunks.push(e.data);
rec.start();
await new Promise(r => setTimeout(r, 10000)); // wait 10 seconds
rec.stop();
await new Promise(r => rec.onstop = r);
const blob = new Blob(chunks);
link.href = URL.createObjectURL(blob);

工作演示：https://jsfiddle.net/jib1/pkc16k9r/

【讨论】：

感谢您的回答，但我需要将字节保存到服务器并从中创建一个 webm 文件。我实际上需要它用于流媒体目的
@subhfyu546754 MediaRecorder 不是为流媒体设计的。 RTCPeerConnection 是。
我正在使用 RTCPeerConnection 进行流式传输，但我还需要将视频分块录制为 webm 文件，可能每 10 分钟一个新文件。我只能播放第一个文件，但不能播放其他文件。我怀疑缺少一些元数据
@subhfyu546754 你试过stop()录音机和start()每10分钟用相同的stream换一个新录音机吗？

【解决方案2】：

你可以使用 RecordRTC

时间片：10000， ondataavailable：函数（b）{ 这每 10000 秒触发一次，但所有元数据仅在第一个文件中 }

【讨论】：