JavaScript MediaSource和MediaRecorder在播放实时流视频时滞后

我一直在基于

RTCConnection

和名为

simple peer

的库，使用

WebRTC

制作流媒体直播视频，但在直播视频（使用

MediaRecorder

）和使用

MediaSource

播放之间，我遇到了一些延迟

这是录音机：

var mediaRecorder=新的mediaRecorder（流，选项）；
mediaRecorder.ondataavailable=handleDataAvailable；
函数HandleData可用（事件）{
如果（已连接&&event.data.size>0）{
发送（事件数据）；
}
}
...
peer.on（'connect'，（）=>{
//在使用数据通道之前，请等待“连接”事件
mediaRecorder.启动（1）；
});

以下是播放的源代码：

var mediaSource=new mediaSource（）；
var源缓冲区；
mediaSource.addEventListener（'sourceopen'，args=>{
sourceBuffer=mediaSource.addSourceBuffer（mimeCodec）；
});
...
peer.on（'data'，data=>{
//收到数据通道消息
sourceBuffer.appendBuffer（数据）；
});

我打开两个标签并连接到我自己，我看到播放视频延迟。。。 似乎我配置的

MediaRecorder

或

MediaSource

---

任何帮助都将不胜感激；）

您结合了两种完全不相关的视频流技术，并且在这两种技术中得到了最坏的权衡。：-）

WebRTC内置了媒体流处理功能。如果您希望使用实时视频，那么WebRTC堆栈就是您想要使用的。它处理编解码器协商，自动调整带宽、帧大小、帧速率和编码参数以匹配网络条件，并将直接减少大量时间以尽可能保持实时播放

另一方面，如果保持质量比保持实时性更可取，那么MediaRecorder就是您要使用的。它不会根据网络条件进行调整，因为它不知道这些条件。MediaRecorder不知道或不关心在数据提供缓冲区后将数据放在何处

如果您试图在录制视频时播放它，将不可避免地越来越落后，因为没有内置的追赶方法。唯一可能发生的事情是缓冲区不足，即播放端等待，直到有足够的数据再次开始播放。即使它落后了几分钟，也不会自动跳到前面

解决方法是使用正确的工具。从你的问题听起来好像你想要实时视频。因此，您需要使用WebRTC。幸运的是，简单对等体使这。。。简单

在录音方面：

const peer = new Peer({
  initiator: true,
  stream
});

然后在回放端：

peer.on('stream', (stream) => {
  videoEl.srcObject = stream;
});

---

简单得多。WebRTC堆栈为您处理一切。

但我不仅需要实时视频，但也要以某种方式将流从一个对等点共享给其他几个对等点，以及我需要的数据块，因为我想要一个数据块，如果某个对等点没有及时从我那里接收到它，也许这个数据块可以从已经接收到的近对等点发送it@DenisKotov你不能两全其美。你不能同时拥有实时和非实时。那怎么办？你是说问题在于接收端太落后了，但你说你也希望他们留下来等待视频。具体来说，你在问什么？你希望发生什么？我想发送视频，例如两个人，但如果第二个人与我的连接有问题或其他问题，我希望收到视频块的第一个人将其发送给第二个人，以某种方式支持我的实时流。。。类似于torrents的功能；）如果他们要继续转发数据，您需要像现在这样使用媒体记录器。但是，这不是实时的。。。您将始终有额外的延迟，这取决于其工作方式的本质。分散对某些项目来说是一个很好的折衷，但是如果你想最有效地使用它，你可以期望你的观众落后几分钟。但是有没有办法消除这种折衷呢？事实上，我刚刚在我的电脑上打开了两个标签，有一个很大的滞后。。。在这种情况下，没有网络延迟。。。