I'm trying to remove a song from an authenticated Spotify user's playlist and for some reason, I get Error 400 Missing Tracks
, even though I know the song is there and the playlist is correct
I am using Pizzly from Bearer to handle the API request
Any idea what could be causing this issue? This is the link to Spotify's API Documentation
This is an example output of JSON.stringify(body)
{"tracks":[{"uri":"spotify:track:2fTdRdN73RgIgcUZN33dvt"}]}
async removeSongsFromPlaylist(context, payload) {
var tracks = payload[0]
var playlistID = payload[1] || context.getters.user.favorites_playlist.id
var authID = context.getters.spotifyAuthID
var endpoint = `/playlists/${playlistID}/tracks`
var uris = tracks.map(track => { return {uri: track.uri}})
var body = {"tracks": uris}
console.log(`URIS:`)
console.log(body);
console.log(`playlist: ${playlistID}`);
return pizzly.integration("spotify").auth(authID).delete(endpoint, {
body: JSON.stringify(body),
headers: { "Content-Type": "application/json" }
})
.then(response => response.json())
.then(responseJSON => {
console.log("song successfully deleted")
console.log(responseJSON)
})
.catch((err) => console.log(err))
},
Update: I did make some progress with a very hacky solution
I took Spotify's cURL example, converted it to fetch with this link and put that inside my function as so:
fetch(`https://api.spotify.com/v1/playlists/${playlistID}/tracks`, {
body: "{\"tracks\":[{\"uri\":\"" + tracks[0].uri + "\"}]}",
headers: {
Accept: "application/json",
Authorization: "Bearer ~accessTokenHiddenForPrivacy~",
"Content-Type": "application/json"
},
method: "DELETE"
})
.then(response => response.json())
Fortunately it worked! The problem is that I tried copy and pasting the body
from below into the code above and it still shows "Missing Tracks". I cannot keep this code below without another way of getting the user's access token- which is currently handled by pizzly and the auth id.