Блог

Я хочу вставить отдельные звуковые и текстовые дорожки, чтобы пользователи могли спокойно переключаться между ними, я уже пытался вставить субтитры

     <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=" 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=" 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>
  

Но это не работает.

Есть ли какой-либо способ вставить звуковые и текстовые дорожки, чтобы они работали во всех браузерах?