在 Spotify API Javascript + 添加到服务器中搜索曲目

Posted 2023-04-15

【中文标题】在 Spotify API Javascript + 添加到服务器中搜索曲目

【英文标题】：Search for track in Spotify API Javascript + Add to Server

【发布时间】：2017-04-18 01:33:26

【问题描述】：

我正在 web2py 和 vue.js 上构建一个 Web 应用程序，它理想地搜索 Spotify 歌曲，列出结果，并让我将选定的结果添加到存储在我的服务器上的播放列表中。

我目前正在尝试实现 Spotify 搜索功能。他们的文档不是很详尽，我几乎不是初学者。

我希望能够在搜索中输入任何内容（播放按钮、曲目标题、艺术家或专辑），获取结果列表并将它们显示在我的网站上的表格中（标题、艺术家、专辑、专辑封面、持续时间等）。我不知道可以使用 Spotify API 上的哪些功能来完成此操作。

列出结果后，我希望能够选择一首歌曲并将其添加到我存储在服务器中的播放列表中。我知道如何执行 POST 请求并将项目添加到数据库，但我不知道如何从列表中选择特定结果并将其信息以 JSON 格式发送到我的服务器。我想我不明白我的歌曲表上的每一行如何链接到我可以传递给服务器的特定 JSON 对象。

【参考方案1】：

以下是获取 Linkin Park's Numb 曲目信息的示例。所以现在你要做的就是将所有这些命令翻译成 javascript，使用 ajax 或

第 1 步：获取轨道 ID

curl -X GET "https://api.spotify.com/v1/search?q=track%3Anumb+artist%3Alinkin+park&type=track" -H "Accept: application/json"

//Javascript
$.get( "https://api.spotify.com/v1/search?q=track%3Anumb+artist%3Alinkin+park&type=track", 
    function( data ) 
        console.log(data);  
    );

第 2 步：获取访问令牌

curl H "Authorization: Basic YOUR_CLIENT_CREDENTIALS" -d grant_type=client_credentials https://accounts.spotify.com/api/token

YOUR_CLIENT_CREDENTIALS是你的ClientId:ClientSecret，你可以使用这个函数来获取它：

btoa('YOUR_CLIENT_ID:YOUR_CLIENT_SECRET')

做ajax请求其实有点棘手，而且Spotify实际上希望你在服务器端做，我建议你参考这个链接：

Access-Control-Allow-Origin denied spotify api

第 3 步：获取音频功能

curl -X GET "https://api.spotify.com/v1/audio-features/YOUR_TRACK_ID" -H "Authorization: Bearer YOUR_Access-TOKEN"

假设轨道 id 是 2nLtzopw4rPReszdYBJU6h：

$.ajax(
   url: 'https://api.spotify.com/v1/audio-features/2nLtzopw4rPReszdYBJU6h',
   headers: 
       'Authorization': 'Bearer ' + 'YOUR_ACCESS_TOKEN'
   ,
   success: function(response) 
       console.log(response);
   
);

从数据库中检索数据实际上取决于您如何设计数据库以及存储什么样的信息，因此应该非常简单。

【讨论】：

感谢您的回复！如何设置以在我的 Javascript 文件上发出这些 get 和 ajax 请求？我需要在文件开头获取访问令牌吗？我需要下载什么吗？我在检索曲目时是否只调用 get 并处理我返回的 json？

步骤 1 可以在不做任何额外操作的情况下完成，只需在 Javascript 中调用 get。这将为您返回包含歌曲的 Spotify 链接、专辑名称和艺术作品的搜索结果列表。但是，如果您想获取单个曲目的额外信息，例如持续时间及其音频功能，则需要访问令牌。为此，您必须在 link 创建一个应用程序并获取客户端 ID 和客户端密码。访问令牌是有过期时间的，不需要每次都获取，过期了再重新获取即可。