Javascript 使用MediaSource扩展来播放视频播放列表

我正试图用HTML5/JS实现一个可靠的、无间隙的视频播放列表。为此，我想在内存中缓冲一个动态播放列表，然后将缓冲区发送到HTML5视频元素

我可以选择视频的编码方式，这只需要在Chrome浏览器上运行，所以我考虑使用webm视频和MediaSource扩展。视频文件将存储在Amazon S3上，并与CloudFront一起交付

我已经看到了下面的MediaSourceAPI示例。关键的区别在于，我不是在读取文件的块，而是在读取大量的文件。

---

如何使其适应于处理多个文件而不是一个文件块？

我们最终编写了这个Javascript库来处理视频播放：

---

它没有使用MediaSourceAPI，但它工作得非常好。

I，关键部分是

source.sourceBuffers[0]。timestampOffset=duration

。然而，这在较新版本的Chrome/Firefox中不再有效。即使是所有人一开始似乎都在使用的，现在也没有完全发挥作用。您是否有任何代码可以用于单个视频？创建一个播放列表是很困难的，因为我甚至找不到一个基本的演示，不再有效。除了这个演示之外，我没有任何工作代码，但是你指出的演示似乎对我有效。这个演示中的视频真的播放了整段视频的6秒钟吗？对我来说，Chrome和Firefox的视频分别在04.19和05.08停止，并带有mediasource.enabled标志，但它过去一直持续6秒。啊，不，你说得对。也许我们应该放弃这个想法，直到浏览器/标准更新。你的想法是什么？是的，不幸的是我不得不提出我的mediasource计划。我有一个老套的退路，我在一个单独的

元素中加载第二个视频，设置为

display:none

，然后在两者上切换display，并在第一个视频结束时开始播放第二个视频。现在已经足够满足我们的需要了，但还不理想，因为缺乏通过“完整视频”进行搜索的控制，并且在慢速设备上的剪辑之间可能会出现口吃。