如何使用 Axios 进行 Spotify Api 发布请求

Question

I'm trying to add a song to the playback queue using this endpoint:

   const add = async () => {
   

    try {
      
      const url = `https://api.spotify.com/v1/me/player/queue?uri=${songUrl}&device_id=${deviceId}`
     
      await axios.patch(url, {
        headers: {
            Authorization: `Bearer ${to}`
        },
    })
    } catch (error) {
      console.log(error);
    }
   
   
}

I'm getting a status 401 error with a message that says no token provided. But when I console.log the token it shows up.

Answer 1

I haven't worked with the Spotify API yet, however, according to their docs , you need to send a POST request, not a PATCH, which is what you used.

Use axios.post() instead of axios.patch() :

const add = async (songUrl, deviceId, token) => {
  try {
    const url = `https://api.spotify.com/v1/me/player/queue?uri=${songUrl}&device_id=${deviceId}`;

    await axios.post(url, {
      headers: {
        Authorization: `Bearer ${token}`,
      },
    });
  } catch (error) {
    console.log(error);
  }
};

Answer 2

The second param of your post request should be body and the third param should be headers . Also, you haven't added all the headers as mentioned in the documentation.

headers: {
      Accept: 'application/json',
      Authorization: 'Bearer ' + newAccessToken,
      'Content-Type': 'application/json',
}

Get your access token from here: https://developer.spotify.com/console/post-queue/

If it still doesn't work try the curl method as mentioned in their docs and if it works, switch it to axios.

Answer 3

I had the exact same issue as you, what I realised was I was passing the header as data rather than as config. This code below should work for you as it works for me.

const add = async () => {
  try { 
    const url = `https://api.spotify.com/v1/me/player/queue?uri=${songUrl}&device_id=${deviceId}`
    await axios.post(url, null,{
      headers: {
        Authorization: `Bearer ${to}`
      },
    })
  } catch (error) {
    console.log(error);
  }
}