如何在video.js中添加字幕和音轨?

时间:2019-03-30 20:59:43

标签: javascript video.js

我想插入单独的音频和文本轨道,以便用户可以在它们之间轻松地切换 我已经尝试插入字幕

    <video
    id="player" class="video-js vjs-default-skin vjs-big-play-centered"
    controls
    preload="auto"
    width="640"
    height="264"
    data-setup='{}'>
    <source src="https://a61.stormo.tv/remote_control.php?file=B64YTo0OntzOjQ6InRpbWUiO2k6MTU1Mzk3ODMzNTtzOjU6ImxpbWl0IjtpOjA7czo0OiJmaWxlIjtzOjMyOiIvdmlkZW9zLzM5NzAwMC8zOTc1MDMvMzk3NTAzLm1wNCI7czoyOiJjdiI7czozMjoiM2RmNjE3NGI0OTVhNGQ2NTEwNWFhMDE2YzI5YTBiYjEiO30%3D" type="video/mp4"> 
    <track label="rus" kind="subtitles" srclang="ru" src="sub-ru.vtt"/>
    <track label="eng" kind="subtitles" srclang="en" src="sub-en.vtt"/>
    </video>

但是字幕只能在Firefox中使用。

我已经尝试插入音频

<video
id="player" class="video-js vjs-default-skin vjs-big-play-centered"
controls
preload="auto"
width="640"
height="264"
data-setup='{}'>
<source src="https://a61.stormo.tv/remote_control.php?file=B64YTo0OntzOjQ6InRpbWUiO2k6MTU1Mzk3ODMzNTtzOjU6ImxpbWl0IjtpOjA7czo0OiJmaWxlIjtzOjMyOiIvdmlkZW9zLzM5NzAwMC8zOTc1MDMvMzk3NTAzLm1wNCI7czoyOiJjdiI7czozMjoiM2RmNjE3NGI0OTVhNGQ2NTEwNWFhMDE2YzI5YTBiYjEiO30%3D" type='video/mp4'>
<source id="my-spanish-audio-track" src="https://www.w3schools.com/html/horse.ogg" type="audio/ogg">
</video>

<script type="text/javascript">
$('document').ready(function(){  
 var player = videojs('player');
var track = new videojs.AudioTrack({
  id: 'my-spanish-audio-track',
  kind: 'translation',
  label: 'Spanish',
  language: 'es'
});
player.audioTracks().addTrack(track);       
});  
</script>

但这不起作用。

有什么方法可以插入音频和文本轨道,以便它们在所有浏览器中都能正常工作?

0 个答案:

没有答案