使用 addTextTrack() 动态更改 videojs 字幕

Question

我正在尝试构建类似视频库的东西，您可以 select 单击缩略图显示视频。现在我正处于为所选视频加载适当字幕的阶段。感谢 google 我知道 videojs 有一个方法可以帮助我调用 addTextTrack() 但不幸的是没有一个好的示例或文档。毕竟我试图通过阅读 video.dev.js 代码来找到它的参数和行为。但据我所知，此方法只有三个参数（种类、标签、语言），我不明白的是：如何设置 src 以加载字幕文件。 我认为这是一个错误，它不能正常工作，如果你同意我的意见，我想报告它。

下面的代码给播放器添加了cc图标但是没有显示字幕（我没告诉他URL加载怎么显示的）

var myPlayer = videojs('video-id');
myPlayer.addTextTrack('captions', 'En', 'English');

我检查了 videojs 5.0.0 的 addTextTrack 方法，没有任何重大变化。

Answer 1

大约一个月后我的问题没有任何答案，我还不知道为什么 addTextTrack() 不能正常工作。但感谢上帝，我找到了实现目标的方法：

动态更改所有文本轨道

var oldTracks = player.remoteTextTracks();
var i = oldTracks.length;
while (i--) {
  player.removeRemoteTextTrack(oldTracks[i]);
}
myNewTracks.forEach(function(track) {
  player.addRemoteTextTrack(track);
});

Answer 2

文本轨道从未动态更新，经过长时间的搜索，我找到了解决问题的方法。当我更改视频源时，我会替换文本轨道并将其设置为 mode="showing":

let player = videojs('first-player');
player.addRemoteTextTrack({
            kind: 'captions',
            src: 'my-track-path.vtt',
            mode: 'showing'
}, false);

使用 addTextTrack() 动态更改 videojs 字幕

Dynamically change videojs captions with addTextTrack()

javascript

dynamic

captions

video.js