什么是 cadenza
cadenza 是一个用于在前端应用程序中添加音乐的 npm 包，它提供易于使用的 API，可以让用户在应用程序中播放、停止、暂停和跳过音乐。cadenza 可以在浏览器环境和 Node.js 环境下运行，并支持多种媒体格式，包括 MP3、WAV、OGG 等。
安装
你可以使用 NPM 包管理器来安装 cadenza。在你的项目根目录下，运行以下命令即可完成安装：
npm install cadenza --save
使用
基本用法
使用 cadenza 时，我们需要先创建一个新的实例。如下所示：
import Cadenza from 'cadenza'; const myMusic = new Cadenza();
现在，我们可以使用该实例来操作音乐。例如，要播放音乐，我们可以这样写：
myMusic.load('http://example.com/music.mp3');
myMusic.play();这将加载一段名为 ‘music.mp3’ 的音乐并开始播放。
加载音乐
在 cadenza 中，要加载音乐必须使用 load 方法。该方法有一个必填参数 url，用于指定要加载的音乐文件的 URL，还可以接受一些可选参数，如下所示：
myMusic.load('http://example.com/music.mp3', {
autoplay: true, // 是否自动播放
loop: true, // 是否循环播放
volume: 0.5, // 音量
crossOrigin: 'anonymous' // 是否允许跨域
});播放音乐
要播放音乐，使用 play 方法即可：
myMusic.play();
注意，只有在调用 load 方法加载音乐后，才能调用 play 方法。否则会报错。
暂停和继续播放
使用 pause 方法可以暂停播放：
myMusic.pause();
使用 resume 方法可以继续播放：
myMusic.resume();
停止播放
使用 stop 方法可以停止播放并重置音乐进度：
myMusic.stop();
跳过音乐
使用 jump 方法可以跳过音乐某一特定时刻进行播放，例如将音乐快进到 30 秒处：
myMusic.jump(30);
获取音乐时长和当前播放进度
使用 getDuration 方法可以获取音乐总时长：
const duration = myMusic.getDuration();
使用 getCurrentTime 方法可以获取当前播放的位置：
const currentTime = myMusic.getCurrentTime();
监听事件
在 cadenza 中，我们可以监听不同类型的事件，例如音乐加载成功、音乐播放结束等。使用 on 方法可以为 cadenza 绑定事件，如下所示：
myMusic.on('load', () => {
console.log('音乐加载成功！');
});
myMusic.on('ended', () => {
console.log('音乐播放结束！');
});音量控制
使用 setVolume 方法可以设置音量：
myMusic.setVolume(0.3);
使用 getVolume 方法可以获取当前的音量：
const volume = myMusic.getVolume();
示例代码
下面是一个完整的示例，演示如何使用 cadenza 播放音乐并控制音量：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
--------- ------- ------------
-------
------
------- ------------------------
------- -------------------------
------- ------------------------
------- ------------------------------
------- --------------------------------
------- ---------------------------------------------------------
--------
----- ------- - --- ----------
-------------------------- - --------- ----- ---
----- ------- - -----------------------------------
--------------- - -- -- -
---------------
--
----- -------- - ------------------------------------
---------------- - -- -- -
----------------
--
----- ------- - -----------------------------------
--------------- - -- -- -
---------------
--
----- ----------- - ---------------------------------------
------------------- - -- -- -
----- ------------- - --------------------
---------------------------------------- - ---- ----
--
----- ------------- - -----------------------------------------
--------------------- - -- -- -
----- ------------- - --------------------
---------------------------------------- - ---- ----
--
---------
-------
-------结语
cadenza 是一个非常实用的 npm 包，能够为我们的前端应用程序添加音乐。希望本文能够对你学习 cadenza 有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005516781e8991b448cea02