如何在Video.js播放器中设置不同的视频质量?


在本教程中,我们将了解如何在Video.js播放器中设置不同的视频质量。设置不同的视频质量意味着我们使用Video.js创建的视频播放器将具有同一视频的多个分辨率,最终用户可以根据自己的喜好或带宽切换分辨率。

但是,Video.js本身并不原生支持此功能,这意味着我们必须使用插件(因为Video.js有广泛的插件和支持)来为我们的视频播放器设置多个视频分辨率。

我们将使用的Video.js插件是一个免费且非常流行的插件,它允许您在Video.js播放器中添加选择视频质量的功能。该插件名为“Video.js Resolution Switcher”。

现在让我们学习如何使用此插件为我们的视频播放器添加视频分辨率支持。

Video.js Resolution Switcher

顾名思义,Video.js Resolution Switcher为我们提供了在各种视频分辨率之间切换的功能。

Video.js Resolution Switcher可以使用npmbower两种方式安装。使用节点包管理器安装此插件,请使用以下命令:

npm i videojs-resolution-switcher —save-dev

如果您使用的是bower包管理器,则可以使用以下命令安装Video.js Resolution Switcher:

注意 - 请确保这些命令是在项目目录中执行的。

由于我们已经安装了“bower install videojs resolution switcher”插件,我们需要将其包含在我们的项目中。

请考虑以下代码片段,将下载的插件合并到我们的本地项目中:

<script src="videojs-resolution-switcher.js"></script>

在这里,我们在`

广告