Video.js 指南

这些指南涵盖了 Video.js 用户的各种主题

音轨

音轨是 HTML5 视频的一个功能,旨在向用户提供可选音轨,以便播放主音轨之外的其他音轨。Video.js 提供了音轨的跨浏览器实现,前提是播放技术支持音轨。

Video.js 的 MSE 播放引擎支持 HLS 和 DASH 的音轨。Safari 也支持 HLS 和 MP4 的原生音轨播放。其他浏览器不支持包括 MP4 在内的原生音轨播放,例如,无法在 Chrome 或 Firefox 中处理 MP4 音轨。

注意事项

  • 无法像添加文本轨道那样通过 HTML 添加音轨。它们必须以编程方式添加。
  • Video.js 仅存储轨道表示。播放时的音轨切换不由 Video.js 处理,而必须在其他地方处理,例如,http-streaming 处理音轨切换以支持通过 UI 选择音轨。

使用音轨

向播放器添加音轨

// Create a player.
var player = videojs('my-player');

// Create a track object.
var track = new videojs.AudioTrack({
  id: 'my-spanish-audio-track',
  kind: 'translation',
  label: 'Spanish',
  language: 'es'
});

// Add the track to the player's audio track list.
player.audioTracks().addTrack(track);

监听音轨启用事件

AudioTrackList 上的音轨被启用或禁用时,将触发 change 事件。你可以监听该事件并对其进行处理。

注意:初始 AudioTrack 选择(通常是已选择的主音轨)不应触发 change 事件。

// Get the current player's AudioTrackList object.
var audioTrackList = player.audioTracks();

// Listen to the "change" event.
audioTrackList.addEventListener('change', function() {

  // Log the currently enabled AudioTrack label.
  for (var i = 0; i < audioTrackList.length; i++) {
    var track = audioTrackList[i];

    if (track.enabled) {
      videojs.log(track.label);
      return;
    }
  }
});

从播放器中移除音轨

假设播放器已存在并拥有您想要移除的音轨,您可以执行以下操作

// Get the track we created in an earlier example.
var track = player.audioTracks().getTrackById('my-spanish-audio-track');

// Remove it from the audio track list.
player.audioTracks().removeTrack(track);

API

有关更完整的信息,请参阅 Video.js API 文档,特别是

  • Player#audioTracks
  • AudioTrackList
  • AudioTrack

videojs.AudioTrack

此类别基于 AudioTrack 标准,可用于创建新的音轨对象。

以下每个属性都可用作 AudioTrack 构造函数的选项。

id

标准定义

此音轨的唯一标识符。如果未提供,Video.js 将生成一个。

kind

标准定义

Video.js 支持 AudioTracks 的标准 kind

  • "alternative":主音轨的可能替代方案。
  • "descriptions":视频轨道的音频描述。
  • "main":此视频的主要音轨。
  • "main-desc":主要音轨,与音频描述混合。
  • "translation":主音轨的翻译版本。
  • "commentary":主要音轨的评论,例如导演评论。
  • ""(默认):无明确类型,或用户代理无法识别轨道元数据中给出的类型。

label

标准定义

将显示给用户的音轨标签。例如,在列出可用作备用音轨的不同语言的菜单中。

language

标准定义

音轨语言的有效 BCP 47 代码,例如,英语的 "en" 或西班牙语的 "es"

有关支持的语言翻译,请参阅 Video.js 根目录下的 语言文件夹 (/lang),并参阅 语言指南,了解 Video.js 中的更多语言信息。

enabled

标准定义

此音轨是否应播放。

在 Video.js 中,我们一次只允许启用一个音轨;因此,如果您启用多个音轨,最后一个启用的音轨将成为唯一一个。虽然规范允许启用多个音轨,但 Safari 和大多数实现一次只允许启用一个音轨。