将 webm 块作为独立视频播放答案

【问题标题】：Playing webm chunks as standalone video将 webm 块作为独立视频播放
【发布时间】：2023-03-21 02:00:02
【问题描述】：

我已经构建了一些代码，这些代码将获取 MediaRecorder API 来捕获音频和视频，然后使用 ondataavailable 函数通过 websockets 将相应的 webm 文件 blob 发送到服务器。然后，服务器通过 websockets 将这些 blob 发送到客户端，客户端使用媒体源扩展 API 将视频放在一个缓冲区中。

这很好用，除了如果我想在中途开始一个流，我不能只发送最新的 blob，因为 blob 本身是不可播放的。另外，如果我乱序发送 blob，浏览器通常会抱怨音频编码不匹配。

我真的不太了解视频容器、编解码器等，但我的问题是，如何将这些 blob 作为独立视频播放？我可以以某种方式使用代码将第一个 blob 中的信息（可单独播放）添加到其他 blob 中吗？什么是能够让流中途播放的好方法？我会转码，但似乎需要很长时间，因为我想设置实时（或接近）流媒体。

谢谢！

【问题讨论】：

标签： video video-streaming webrtc webm web-mediarecorder

【解决方案1】：

只有从 MediaRecorder API 接收到的第一个 blob 包含标头。因此，您需要简单地提取它并将其添加到您的其他 blob 中，以便能够将它们作为独立的 WebM 视频播放。我建议您使用十六进制编辑器等工具来验证它是否有效。您可以在您的服务器上自动执行此过程。

【讨论】：

@SumanBogati 抱歉，我找不到工作代码。我建议您手动尝试并使用十六进制编辑器验证每个块是否可以独立播放。切片标头并添加到下一个块（后端）。但我发现这种方法是错误的，因为它开始叠加延迟。 TCP WebSocket 不适用于流式传输。试试这种方法 - RTCPeerConnection。他们已经为您建立了 UDP 连接。 developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection 如果是用于生产，请使用 Twilio。我能够在 10 分钟内构建完美的视频流。 twilio.com/video
感谢您的回复，您能在这里提出一些建议吗，stackoverflow.com/questions/62236838/…

【解决方案2】：

使用 MSE，您可以加载包含带有轨道信息的 WebM 段的第一个块，然后再开始加载集群。浏览器会自己解决的。

WebM 集群以时间戳开头，这使它能够工作。

【讨论】：

我在 Chrome 上得到了这个工作，但在 FireFox 上没有。最终走向另一个方向，将 Kurento 设置为媒体服务器并使用 WebRTC，这比摆弄 MSE 容易得多
MSE 是玩大块 webm 的唯一方法吗？我们不能像音频/mpeg http 那样分块吗？（通过简单的 http 可以正常播放）
@KeyneViana 是的，您也可以直接从服务器上播放它。问题是关于来自 MediaRecorder 的数据。
@Brad 我正在努力做到这一点stackoverflow.com/questions/48891897/… 介意在那儿换行吗？