Context: I am new on the technology hence on developing my first project Music Master, for accessing the details of artist i have to use developer.spotify.com
The following is the code snippet:
const BASE_URL = 'https://api.spotify.com/v1/search?';
const FETCH_URL = `${BASE_URL}q=${this.state.query}&type=artist&limit=1`;
console.log('FETCH_URL', FETCH_URL);
fetch('FETCH_URL', {
method:'GET',
headers: {
'Accept': 'application/json',
"Authorization": "Bearer BQAuzRQntApSOi_2gTlydxGPPY10waidioQkY53QKQSbUUsNrsZ8Tjl1jmema_P3dfV9lGAVuJmgzhDopTi632A_kyXhDchV_pLKf_2ot28ru9vCdFCbpPtVopwFRTuUA_8dAvQHogFlJPBhd9VQhJD0PSBFf4NZdPbl-PTcyTCvRVf84Is2d6mFeTRKAXmPTMU" }
})
.then(response => response.json())
.then(json => {
const artist = json.artists.items[0];
console.log('artist', artist);
this.setState({artist});
});
After the execution of code, i am receiving error:
{
"error": {
"status": 401,
"message": "No token provided"
}
}
When i use the curl command in terminal:
curl -X "GET" "https://api.spotify.com/v1/search?
q=this.state.query&type=artist&limit=1" -H "Accept: application/json" -H "Content-
Type: application/json" -H "Authorization: Bearer
QAuzRQntApSOi_2gTlydxGPPY10waidio
QkY53QKQSbUUsNrsZ8Tjl1jmema_P3dfV9lGAVuJmgzhDopTi632A_k
yXhDchV_pLKf_2ot28ru9vCdFCbpPtVopwFRTuUA_8dAvQHogFlJPBhd9VQhJD0PSBFf4NZdPbl-
PTcyTCvRVf84Is2d6mFeTRKAXmPTMU"
I am receiving a proper formatted output in terminal:
{
"artists" : {
"href" : "https://api.spotify.com/v1/search?
query=this.state.query&type=artist&offset=0&limit=1",
"items" : [ {
"external_urls" : {
"spotify" : "https://open.spotify.com/artist/0DpQjnQLcu01O2o6lqCPiL"
},
"followers" : {
"href" : null,
"total" : 2751
},
"genres" : [ "ambient post-rock", "blackgaze", "canadian experimental" ],
"href" : "https://api.spotify.com/v1/artists/0DpQjnQLcu01O2o6lqCPiL",
"id" : "0DpQjnQLcu01O2o6lqCPiL",
"images" : [ {
"height" : 640,
"url" : "https://i.scdn.co/image/ab6761610000e5eb932ea1420ceae35a2ef4f61d",
"width" : 640
}, {
"height" : 320,
"url" : "https://i.scdn.co/image/ab67616100005174932ea1420ceae35a2ef4f61d",
"width" : 320
}, {
"height" : 160,
"url" : "https://i.scdn.co/image/ab6761610000f178932ea1420ceae35a2ef4f61d",
"width" : 160
} ],
"name" : "Thisquietarmy",
"popularity" : 4,
"type" : "artist",
"uri" : "spotify:artist:0DpQjnQLcu01O2o6lqCPiL"
} ],
"limit" : 1,
"next" : "https://api.spotify.com/v1/search?query=this.state.query&type=artist&offset=1&limit=1",
"offset" : 0,
"previous" : null,
"total" : 6
}
Please help me, i am not able to understand where i am going wrong.