TextTracks提示为空

Question

我需要能够从视频中的TextTracks对象中获取线索数组。

我有以下代码：

videojs("example_video_1", {}, function(){
   // Player (this) is initialized and ready.
    var aTextTrack =  this.textTracks()[0];

    aTextTrack.show();
    var theArray = this.textTracks()[0]['$'];
    console.log(theArray);
    console.dir(this.textTracks()[0]['$']);
    // EXAMPLE: Start playing the video.
    this.play();

}); 

​

​

var theArray打印为空，但console.dir打印数组的内容。我怎样才能得到这些价值？我知道它与javascript变量有关。

干杯

Answer 1

这是正确的答案。我花了一段时间才破解它，因为videoJS上没有太多的文档

videojs("example_video_1", {}, function(){
    // Player (this) is initialized and ready.
    var aTextTrack =  this.textTracks()[0];
    aTextTrack.on('loaded', function() {
            console.log('here it is');
            cues = aTextTrack.cues();
            console.log('Ready State', aTextTrack.readyState()) 
            console.log('Cues', cues);
    });

    aTextTrack.show();//this method call triggers the subtitles to be loaded and loaded trigger
    this.play();

});

Answer 2

@禤浩焯；这些是VideoJS的缩小的内部对象，如果您将它们用于代码，那么下一个版本的VideoJS将使工作变得过时。

如果可能的话，最好使用VideoJS的API。在这种情况下，它们没有一个API来读取字幕，所以您有几个选项：

1. 使用CSS重新设计字幕显示对象的样式。
2. 使用JS扫描字幕-显示HTML并在文本更改时触发.然后，您可以捕获文本并在您的JS应用程序中按您的意愿使用它。

在浏览器上扫描div会非常密集，所以如果可能的话，我推荐#1。

Answer 3

到2015年，您可以在文本轨道( loadeddata track，视频公关)上收听视频公关事件，尽管它没有很清楚的文档记录

// add a text track
player.one('loadedmetadata', () => {
  player.addRemoteTextTrack({
    kind: 'captions',
    language: 'en',
    label: 'English',
    src: '/path/to/subtitles',
  }, true)
})

// listen for text tracks being added
player.textTracks().addEventListener('addtrack', (event) => {
  // listen for the track's cues to finish loading
  event.track.on('loadeddata', () => {
    doSomethingWithCues()
  })
})