Supabase Spotify API 请求

Question

我正在尝试创建一个使用 Supabase 进行身份验证并登录 Spotify 的 Django 应用程序。我使用视图来这样做：

def spotify_auth(request):

    # Redirect the user to Supabase's OAuth authentication endpoint
    data = supabase_client.auth.sign_in_with_oauth({
                "provider": 'spotify',
                
                "redirectTo": "http://127.0.0.1:8000//callback/",
                   
    })
    
    auth_url = data.url

    return redirect (auth_url)

这会将我重定向到如下网址：http://127.0.0.1:8000/callback/#access_token= 这是我的主页。从我的主页，我希望能够重定向到 /top-tracks，同时维护访问令牌，因此我将其保存到会话中，如下所示：

// Get the fragment URL from the current URL
const fragmentUrl = window.location.hash;

// Parse the fragment URL to extract key-value pairs
const urlParams = new URLSearchParams(fragmentUrl.substring(1));

// Extract and save each piece of data
const access_token = urlParams.get('access_token');

// Save the extracted data to localStorage (or sessionStorage if needed)
localStorage.setItem('access_token', access_token);

我有一个按钮可以重定向到 /top-tracks，在我的 top-tracks.html 中我有一个脚本：

<script>

const access_token = localStorage.getItem('access_token');
console.log("access token:",access_token)

const getTopTracks = async () => {

  const url = new URL('https://api.spotify.com/v1/me/top/tracks');
  url.searchParams.append('time_range', 'short-term');
  url.searchParams.append('limit', '20');

  const response = await fetch(url,{
    method:'GET',
    headers: { 'Authorization': 'Bearer ' + access_token },
  });

  const data = await response.json();
  console.log(data)
} 

getTopTracks();


</script>

当脚本运行时我得到

（索引）：39 GET https://api.spotify.com/v1/me/top/tracks?time_range=short-term&limit=20 401

我做错了什么？

编辑：我尝试使用provider_token而不是access_token并收到403错误

Answer 1

provider_token

是此处使用的正确标记，因此使用

provider_token

而不是

access_token

是正确的。您收到 403 错误的原因可能是因为您没有访问所请求数据的范围。仔细检查您请求的范围。

https://github.com/spotify/web-api/issues/1118