CODEWITHSUNDEEP
reactjsapispotify
maxccpage
maxccpage

Reputation: 21

Error 400 Bad Request Spotify API Post Request

Im working on a web application which users can search music, create a new playlist then save it to their Spotify account. Im currently stuck on creating a new playlist on the users Spotify. 

    `        //userUd, playlistName, currentUserAccessToken are all defined 

fetch(`https://api.spotify.com/v1/users/${userId}/playlists`, {
              headers: {
                'Authorization': 'Bearer ' + currentUserAccessToken
              },
              contentType: 'application/json',
              method: 'POST',
              body: {
                "name": `${playlistName}`,
                "description": `You made this playlist with Jammming, a ReactJS web application built by Max Page`
              }
            }).then(playlist => {
              console.log(playlist);
              return playlist.json();
            }).catch(err => {
              console.log(err);
            })`

The goal here is get the new playlistId, anybody have any idea as to why Im receiving the 400 Bad Request error? I did the GET request to authorize user - included scope for creating public playlist, in different code block which is working, here's that: 

`let scopes = 'playlist-modify-public';

 window.location.replace(`https://accounts.spotify.com/authorize?client_id=${clientID}&scope=${scopes}&redirect_uri=${redirectURI}&response_type=token`);`

Thanks in advance!

Upvotes: 0

Views: 2819

Answers (1)

Sujit.Warrier
Sujit.Warrier

Reputation: 2869

stringify your body. that is what fixed the same error for me

fetch(`https://api.spotify.com/v1/users/${userId}/playlists`, {
          headers: {
            'Authorization': 'Bearer ' + currentUserAccessToken
          },
          contentType: 'application/json',
          method: 'POST',
          body: JSON.stringify({
            "name": `${playlistName}`,
            "description": `You made this playlist with Jammming, a ReactJS web application built by Max Page`
          })
        }).then(playlist => {
          console.log(playlist);
          return playlist.json();
        }).catch(err => {
          console.log(err);
        })`

Upvotes: 1

Related Questions