如何在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可以使用npm和bower兩種方式安裝。使用節點包管理器安裝此外掛，請使用以下命令：

npm i videojs-resolution-switcher —save-dev

如果您使用的是bower包管理器，則可以使用以下命令安裝Video.js Resolution Switcher：

注意 - 請確保這些命令是在專案目錄中執行的。

由於我們已經安裝了“bower install videojs resolution switcher”外掛，我們需要將其包含在我們的專案中。

請考慮以下程式碼片段，將下載的外掛合併到我們的本地專案中：

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

在這裡，我們在`