Is there any way to get current caption's text from video tag using Video.js?

前端 未结 5 726
日久生厌
日久生厌 2021-01-06 18:30

I want to get current subtitles\' text during playing a video (and than implement own subtitles block (i.e. to hide original) and also use the information in a few different

相关标签:
5条回答
  • 2021-01-06 19:03

    Solution:

        videojs("example_video_1").ready(function() {
            myvideo = this;
    
            var aTextTrack =  this.textTracks()[0];
            aTextTrack.on('loaded', function() {
                console.log('here it is');
                cues = aTextTrack.cues();   //subtitles content is here
                console.log('Ready State', aTextTrack.readyState()) 
                console.log('Cues', cues);
            });
    
            //this method call triggers the subtitles to be loaded and loaded trigger
            aTextTrack.show();
        });
    

    Result:


    PS. Code found here.

    0 讨论(0)
  • 2021-01-06 19:07
    var videoElement = document.querySelector("video");
    var textTracks = videoElement.textTracks; 
    var textTrack = textTracks[0]; 
    var kind = textTrack.kind // e.g. "subtitles"
    var mode = textTrack.mode
    

    Try this one

    0 讨论(0)
  • 2021-01-06 19:08

    This code gets the current cue and put into the <span> element

    (function(){
    
        var video = document.querySelector('video');
        var span = document.querySelector('span');
    
        if (!video.textTracks) return;
    
        var track = video.textTracks[0];
        track.mode = 'hidden';
    
        track.oncuechange = function(e) {
    
            var cue = this.activeCues[0];
            if (cue) {
                span.innerHTML = '';
                span.appendChild(cue.getCueAsHTML());
            }
    
        };
    })()
    

    Here is the tutorial :Getting Started With the Track Element

    0 讨论(0)
  • 2021-01-06 19:09

    Use the HTML5 Video API to get the current source, the split the src using / and . to get the name.

    Media API

    The above link has all the available API in the HTML5 video player. Your plugin uses HTML5 video player!

    0 讨论(0)
  • 2021-01-06 19:15

    Yes, you can add a cuechange event listener when your video loads. This can get you the current track's caption text. Here is my working example using videojs.

    0 讨论(0)
提交回复
热议问题