在Spotify API Javascript添加到服务器中搜索跟踪

Question

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

我目前一直在尝试实现Spotify搜索功能。他们的文档不是很全面，我只是一个初学者。

>

我希望能够在搜索中输入任何内容（播放按钮、曲目标题、艺术家或专辑），获得结果列表并将其显示在我的网站上的表格上（标题、艺术家、专辑、专辑封面、持续时间等）。我不知道SpotifyAPI上的哪些函数可以用来实现这一点。

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

Answer 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实际上希望你在服务器端做，我建议你参考这个链接：

访问控制允许来源被拒绝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);
   }
});

从数据库中检索数据实际上取决于你如何设计数据库以及你存储了什么样的信息，所以这应该是非常直接的。