Help Wizard

Step 1

NEXT STEP

blocked by CORS policy

blocked by CORS policy

Hello,


When I call Spotify API (https://api.spotify.com/v1),

I have the following error:


Access to XMLHttpRequest at 'https://api.spotify.com/v1/me' from origin 'https:XXX' has been blocked by CORS policy: Request header field pragma is not allowed by Access-Control-Allow-Headers in preflight response.

 

For information it worked before and since yesterday I have the error.
I created a new app, but the same.
Do you have an idea to unblock me?
For information, I use Axios in VueJS

 

My code:

 

const service = axios.create({ baseURL: "https://api.spotify.com/v1" });
letresponse = null;
await service
.get(`${path}`, {
   headers: {
      'Authorization': `Bearer ${access_token}`,
      'Content-Type': 'application/json'
   }
})
.then(result => {
   response = result. data;
})
.catch(error => {
   console.log('error spotify api',error);
})

 

Thank you.

Reply
3 Replies

You need to add some headers to your request, not sure how it would look like in axios but below is an example in python 

response.setHeader("Access-Control-Allow-Origin", "*"); response.setHeader("Access-Control-Allow-Credentials", "true"); response.setHeader("Access-Control-Allow-Methods", "GET,HEAD,OPTIONS,POST,PUT"); response.setHeader("Access-Control-Allow-Headers", "Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers");

https://stackoverflow.com/questions/32500073/request-header-field-access-control-allow-headers-is-not-allowed-by-itself-in-prfrom 

Thank you Ximicc,

but it's not working 😞

Access to XMLHttpRequest at 'https://api.spotify.com/v1/me' from origin 'https://XXX' has been blocked by CORS policy: Request header field pragma is not allowed by Access-Control-Allow-Headers in preflight response.

 

I've this error if I add : 

withCredentials: true

 

Access to XMLHttpRequest at 'https://api.spotify.com/v1/me' from origin 'https://XXX' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

Suggested posts