前言
在开发Web应用程序时，我们经常需要使用第三方库来加速我们的开发过程。其中，npm 是最最常用的包管理器，在 npm 上可以找到海量的开源库来帮助我们完成各种任务。本文介绍如何使用 @jonny/onetune-spotify 这个 npm 包来实现与 Spotify 接口的交互，方便您在 Web 应用程序中使用 Spotify 的音乐播放器。
安装
使用 npm 安装 @jonny/onetune-spotify 包：
npm install @jonny/onetune-spotify
使用方法
准备工作
在使用 @jonny/onetune-spotify 前，您需要前往 Spotify Developers 网站，创建一个应用，并从中获取到 Client ID 和 Client Secret。具体过程可以参考 Spotify 开发者文档。
请求登录
为了与 Spotify 接口进行交互，我们需要首先进行用户登录。@jonny/onetune-spotify 提供了唯一方法：
-- -------------------- ---- -------
------ - ----------- - ---- -------------------------
----- ---- - --- -------------
--------- -----------------
------------- ---------------------
------------ --------------------------------
---
-------------此时，login() 方法会将用户转发到 Spotify 登录认证页面，如果用户未登录，此时会提示用户输入登录信息，并允许用户授权访问。
登陆完成后，Spotify 服务器将发送回调请求至我们前面设置好的 redirectURI。我们需要在页面首先处理回调请求：
auth.processCallback().then(() => {
// 鉴权后的回调
}).catch(() => {
// 鉴权失败后的回调
});注：请确保 redirectURI 和您应用程序的设置保持一致。
请求指定用户的信息
继续使用前面创建的 auth 实例，向 Spotify 服务器请求指定用户信息：
auth.requestUserInfo().then(user => {
console.log(`Hello, ${user.display_name}`);
});此时，会通过 requestUserInfo() 方法请求并获取到当前认证的用户信息。更多用户信息，请参阅 Spotify 开发者文档。
搜索音乐
@jonny/onetune-spotify 提供了从 Spotify 获取音乐信息的方法。现在，我们来搜索余华的一首歌曲：
-- -------------------- ---- -------
------ - ---------- - ---- -------------------------
----- --------- - -------
----- ---------- - -----
----- ------ - --- ----------------------------------
--------------
------------- ----------------------
- ----- -------- ------ - --
------------- -- -
----- ----- - -----------------------
--------------- ----- --------------- -- ---------------------------
---此时，search() 方法将返回一个搜索结果的对象，该对象包含了若干首匹配的乐曲信息，我们只需要选择第一首歌曲即可。
注： getAccessToken() 方法将返回当前已认证的 access token，以保证 API 请求成功。
播放音乐
现在，我们已经完成了搜索音乐，那么如何播放它呢？
@jonny/onetune-spotify 提供了一种方便的方式以便播放音乐，代码示例如下：
-- -------------------- ---- -------
------ - ------------- - ---- -------------------------
----- -------- - -----------------
----- ------ - --- ----------------------- -----------------------
--------------
------------- ----------------------
- ----- -------- ------ - --
------------- -- -
----- -------- - ---------------------------
-- -----
------------- ------------ -------- ---
---注：在启动播放器之前，必须 创建一个播放器 并在创建播放器后，从所得到的响应（HTTP 204）中检索出设备 ID。
后记
到此，我们已经学会了如何使用 @jonny/onetune-spotify 这个 npm 包来实现 Spotify 的音乐播放器的集成。此时，我们已经能够轻松地与 Spotify 交互、搜索、播放音乐等等。对于后续开发，您可以通过使用 Spotify 提供的 Web API 来实现更多功能。
完整代码请访问 Github: https://github.com/jonnyxzhang/onetune-spotify-demo
Happy coding!
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066bc4967216659e244301