Help Wizard

Step 1

NEXT STEP

FAQs

Please see below the most popular frequently asked questions.

Loading article...

Loading faqs...

VIEW ALL

Ongoing Issues

Please see below the current ongoing issues which are under investigation.

Loading issue...

Loading ongoing issues...

VIEW ALL

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