Spotify API簡易入門教學,獲取你的個人音樂清單JSON資料格式

2024/04/09閱讀時間約 4 分鐘




前言

本次教學主要內容是如何使用Spotify Api獲取自己帳號的音樂清單資料,以Postman來進行測試,了解Spotify Api的Token使用流程。



Spotify Api 開發者手冊

https://developer.spotify.com/documentation/web-api




Spotify Token

取得Spotify Token才能在後續請求使用者資料,在獲取Spotify Token前需要先註冊Spotify帳號登入並獲取開發者身分ID。

登入儀表板

請到Spotify API官方網站登入Spotify帳號,並再儀表板中取得 Client ID、Client secret 在後續請求規範中需要帶入來進行身分驗證。


PostMan 取得Spotify Token

cURL規範

以下是官方所給出的請求內容規範,cURL會描述在請求Api時所需要的條件或是需要帶入的規定型態。

curl -X POST "<https://accounts.spotify.com/api/token>" \\
-H "Content-Type: application/x-www-form-urlencoded" \\
-d "grant_type=client_credentials&client_id=your-client-id&client_secret=your-client-secret"
  1. POST “https://accounts.spotify.com/api/token"在Headers 新增Key & Value
Key: Content-Type Value: application/x-www-form-urlencoded
raw-image


3. Body 新增Key & Value

在這裡請將自己剛剛在儀表板中取得的client_id client_secret填入,其他按照規範所描述的參數帶入

Key: grant_type Value: client_credentials
Key: client_id Value: your-client
Key: client_secret Value: your-client-secret
raw-image


4. Send

這樣就可以獲得一個資料物件,也就是最常見的JSON物件,access_token 的Value也就是你的Token,在後需都需在每一次請求中認證Bearer Token。

raw-image



獲取Spotify Playlist

cURL規範

curl --request GET \\
--url [<https://api.spotify.com/v1/playlists/>](<https://api.spotify.com/v1/playlists/3cEYpjA9oz9GiPac4AsH4n>){playlist_id}/tracks \\
--header 'Authorization: Bearer 1POdFZRZbvb...qqillRxMr2z'

playlist_id

首先我們需要找到自己想獲取的Playlist ID,這個ID沒有隱私,只是作為連結參數,取得方法也很簡單,到自己的Spotify找到自己清單的分享按鈕,取得連結,ID可以在連結中找出。

raw-image


Postman

  1. GET https://api.spotify.com/v1/playlists/{playlist_id}/tracks
把{playlist_id}換自己清單的playlist_id

2. Bearer Token

在Authorization選擇Bearer Token,帶入自己前面所獲得的access_token
raw-image


3. Send

你會得到一個好幾千行的JOSN,可以在小小的JSON花園裡面挖呀挖呀挖了~


結語

最後我們可以透過Postman這樣的Api測試,來確定Spotify Api是可以正常運作的,後續也就可以自行建立Node.js Api Server來客製化自己的Api,或是直接在前端Fetch Spotify Api來使用,不用再程式碼上面測試,或者直接拿取Postman上面的最終結果JSON資料來使用

9會員
11內容數
R036 部落格是一個共享知識、學習成長和技術交流的地方。 生活系列短文 【一分鐘午後微醺】捕捉記錄下每個影視中有寓意的段落 【三分鐘膠囊咖啡】一些有用的知識概念 Instagram社群 軟體開發社群 @art.code.design 藝術與人文社群 @art.code.design.ll
留言0
查看全部
發表第一個留言支持創作者!