video - 如何使用 HTTP Live Streaming 在 Safari 中启用视频搜索？

Question

我有一个播放列表中带有 #EXT-X-PLAYLIST-TYPE:EVENT 的 HLS 流。这在 Safari 中播放正确，除了在 #EXT-X-ENDLIST 附加到播放列表之前搜索不可用。

据我了解，带有 #EXT-X-PLAYLIST-TYPE:EVENT 的播放列表包含到目前为止视频的所有片段。也就是说，可以附加新的段，但不能删除或修改现有的段。不。如果前面的片段实际上是不可变的，那么 Safari 中的视频播放器难道不应该允许用户向后搜索视频的前面部分吗？相反，播放器只是说“直播”并且在 #EXT-X-ENDLIST 附加到播放列表之前没有拖动控制。

Technical Note TN2288说这个(强调我的):

An event playlist is specified by the EXT-X-PLAYLIST-TYPE tag with a value of EVENT. An event playlist looks just like a live playlist to start out with. It doesn't initially have an EXT-X-ENDLIST tag, indicating that new media files will be added to the playlist as they become available. However, with the EVENT tag, you cannot change the playlist at all; you may only append new segments to the end of the file. They cannot be added at the front. New segments are added until the event has concluded, at which time the EXT-X-ENDLIST tag is appended. As the name implies, event playlists are typically used for events such as concerts or sports games where you want to allow the user to seek anywhere in the event from the beginning.

在我看来，使用这种 HLS 播放列表应该可以进行搜索，那么我错过了什么？

Answer 1

我找到的解决方法是:

<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<video id="video" controls="controls"></video>
<script>
var video = document.getElementById('video');
var url = 'http://awesome.app/playlist.m3u8';
if (Hls.isSupported()) {
    var hls = new Hls({
        debug: true
    });
    hls.loadSource(url);
    hls.attachMedia(video);
    hls.on(Hls.Events.MANIFEST_PARSED, function () {
        video.play();
    });
}
</script>

以上内容从最近上传的片段开始，并允许在 Safari、Chrome 和 Firefox 上搜索更早的片段。