Vue3 + Video.js实现MKV视频音轨获取与切换问题咨询

能否实现？ #

可以通过Video.js实现MKV视频的音轨获取与切换，但核心前提是解决浏览器对MKV容器及音轨编码的支持限制——MKV并非Web标准媒体容器，多数浏览器原生对其支持不完善，这是调用videojs.audioTracks()返回空值的主要原因。

解决步骤 #

1. 优先转码为Web友好格式
   直接播放MKV存在兼容性问题，最稳妥的方案是将MKV转码为HLS或DASH格式：

   • 这两种格式原生支持多音轨，且被绝大多数现代浏览器兼容
   • 转码时保留所有音轨，Video.js可通过原生audioTracks()API直接识别并管理

2. 确保音轨编码被浏览器支持
   如果坚持使用MKV，需检查音轨编码：

   • 浏览器仅支持AAC、MP3、Opus等编码格式，若MKV内音轨为DTS、AC3等非Web兼容编码，浏览器无法解析，自然返回空音轨列表
   • 需将音轨转码为AAC等支持的编码格式

3. 正确监听音轨加载时机
   不要在视频初始化完成前调用audioTracks()，必须等待视频元数据加载完成：

   const player = videojs('video-player');
   player.on('loadedmetadata', () => {
     const tracks = player.audioTracks();
     // 此时可遍历tracks进行切换操作
     for (let i = 0; i < tracks.length; i++) {
       tracks[i].enabled = (i === 0); // 默认启用第一条音轨
     }
   });
   

4. 手动音轨切换实现
   当成功获取音轨列表后，可通过修改enabled属性实现切换：

   // 切换到第n条音轨（n从0开始）
   function switchAudioTrack(player, trackIndex) {
     const tracks = player.audioTracks();
     if (trackIndex >= 0 && trackIndex < tracks.length) {
       for (let i = 0; i < tracks.length; i++) {
         tracks[i].enabled = (i === trackIndex);
       }
     }
   }
   

不推荐的方案 #

如果尝试在前端直接解码MKV（比如用FFmpeg.js），虽然能提取音轨，但会带来极高的性能开销，仅适用于特殊场景。

内容的提问来源于stack exchange，提问作者Javistik