javascript - 即使附加了足够的内容，视频也无法播放

Question

我有一个设置，使用 websockets 协议(protocol)发送一个 10 分钟长的视频(大象之梦)，每个视频分成 4 秒的短片段。
我使用浏览器作为客户端，带有 Websocket API接收内容和 HTML5 视频标签作为播放器，我使用 Media Source Extensions 将 block 添加到视频中。 .

问题是，某处似乎存在限制(最大接收缓冲区大小、最大媒体源源缓冲区缓冲区大小、视频元素上的最大缓冲内容等)，因此视频无法正确播放到最后，甚至更早停止如果有足够的数据。

所有段均正确到达并及时添加。同时，视频从头开始播放。
您可以看到播放器上显示缓冲视频的灰线不断增长，直到某个时间点停止增长并且视频在到达此位置时停止播放。
然而，关于输出消息，完整视频已附加到 mediasource 元素，也可以通过手动跳转到 future 或过去的另一个位置来测试。看起来总是只有一小部分内容“加载”。

由于我在本地主机上测试它，吞吐量非常高，因此我尝试将其降低到更常见的值(仍然优于视频比特率)，以查看我是否使客户端过载，但这并没有改变任何内容。

还尝试了不同的段大小，结果完全相同，只是停止的时间不同。

知道这个限制在哪里或者可能发生什么吗？

Answer 1

我认为您的缓冲数据存在间隙。浏览器可以附加的缓冲区大小是有限的。当达到该限制时，如果您附加其他数据，浏览器将通过从缓冲区中丢弃一些不需要的帧来默默地释放一些空间。根据我的经验，如果发生得太快，最终可能会在缓冲区中出现间隙。您应该在追加时监视 buffered 属性的状态，以查看是否存在任何间隙。