使用 hls.js 播放带有滚动直播窗口的直播流，如何保持 webvtt 中的字幕对齐？

我可以使用播放列表 master.m3u8、video.m3u8 和 metadata.m3u8 通过 hls.js 播放器播放实时流。该视频是使用 ffmpeg hls 命令创建的，并使用带有 args 的滚动实时窗口：

-hls_list_size 20 -hls_time 2 -hls_flags delete_segments

这会创建从 video0.ts 到 video19.ts 的视频片段，然后在添加新片段时开始删除第一个片段。 video.m3u8 最终看起来像...

#EXTM3U
#EXT-X-VERSION:3
#EXT-X-TARGETDURATION:2
#EXT-X-MEDIA-SEQUENCE:25
#EXTINF:2.002133,video25.ts
#EXTINF:2.002133,video26.ts
...

我的 metadata.m3u8 播放列表看起来很相似，虽然我是从不同的来源创建的。视频和元数据播放列表保持同步，从我的直播开始就可以正常播放。

#EXTM3U
#EXT-X-VERSION:6
#EXT-X-TARGETDURATION:2
#EXT-X-MEDIA-SEQUENCE:25
#EXTINF:2.000
sub_25.vtt
#EXTINF:2.000
sub_26.vtt
...

当我重新加载播放器页面时，问题就开始了。重新加载时，播放器会加载播放列表，并将在当前直播点正确播放。

我看到它加载了 video45.ts 和 sub_45.vtt 周围的片段。这似乎是正确的，因为 video.m3u8 中的媒体序列为 25。添加 20 个片段播放列表大小，实时位置约为第 45 个片段。这是直播大约 90 秒。

但是，播放器中的媒体时间显示为 40 秒。好像用播放列表中的片段数才得出40秒，虽然真实的直播时间是90秒。

最终产生的问题是，40 秒的媒体时间被用于引用文本轨道提示并显示 40 秒的字幕......而不是 90 秒标记视频实际来自的位置。

有没有办法让播放器正确反映“真实”时间，尽管直播窗口是滚动的，以便字幕（正确加载）在正确的时间显示？

或者滚动窗口实时播放是否不适用于 vtt 中的字幕？

如果我禁用滚动窗口支持，我可以多次重新加载直播，“完整”直播时间加载和字幕排列正常。

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

相关问答