Announcements

Help Wizard

Step 1

NEXT STEP

Refresh Token API returning CORS errors

Refresh Token API returning CORS errors

Hello,

I am a developer consuming the Web API and suddenly today all my requests to Refresh Access Tokens are not working on the browser. Postman works fine, but the browser is throwing CORS errors. 

 

No change to code on my end, and if I get an access token through postman, then all subsequent API requests work.

This is the kind of error I am getting suddenly.

 

Access to fetch at 'https://accounts.spotify.com/api/token' from origin 'https://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

 

EDIT: This morning the api started working as expected on its own. No code changes at all have gone in and the full functionality on my web app is working now. 

I’d love to hear from the Spotify team about what happened. 

Reply
18 Replies

I just came across the same situation.
A web app that I deployed three months ago suddenly stopped working with a CORS error!
I'm looking for an official solution.

I also have the same issue, I opened up my web-app, which worked fine a week ago when I used it last time. Now I get the problem when trying to get a auth-token (POST to https://accounts.spotify.com/api/token). Wierd, I assume it could be a server side problem at spotify?

Hi!

I assume it is a server-side error. I wrote a web-application a week ago (POST request to the /token URL which returned a auth-token) and it worked fine, and now I get the same problem as you. I guess we will have to wait and see if the problem is common or if we need to improve our code  xD

Same here, just yesterday my app was working. I haven't changed any code, but now I can't fetch access tokens.

Access to XMLHttpRequest at 'https://accounts.spotify.com/api/token' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

It's related to the request origin port. If you are running your web-apps on ports that aren't 80 or 443, it doesn't work.
EDIT: Now it doesn't even work there. Well... Huh...

Yeah. It’s down everywhere for me http or https. The only place where it works is with postman, but the browser can’t get the refresh tokens anymore.

In my particular case, my refresh token components have been working for almost a whole year. Zero issues. Until this week. 

when nothing has changed on my end I can’t really think of anything other than being an issue on the API end, not on mine.

Yeah. It’s only the token api because if I inject an access token obtained through postman, then the rest of the web api works. 

same as for me 😕 hope they solve the problem soon, I am eager to continue coding 😄

Yup. It’s unfortunate. Hoping one of the Spotify folks here in the forum catches this soon and let’s us know what’s going on. 😕 

For some odd reason, my server seems to fetch everything as always. As you can see in the background, I'm getting playback activity too... But it doesn't seem to work when I do so from the browser... Huh

 

EDIT: If you set the request from the browser to:

mode: 'no-cors'

 You will get an 'invalid_client' error with a Bad Request header...

imagen.png

I fixed this by fixing a typo in the data parameters of my AJAX request. Don't know if that helps anyone.

Access to fetch at 'https://accounts.spotify.com/api/token' from origin 'https://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Have you tried adding the "Access-Control-Allow-Origin" header like the error message says you should? That's the first thing I would try.

This is related to the URL, accounts.spotify.com,

 

I am creating a stand alone watchOS app and I need to authenticate the user with the web api according to the Oauth 2 flow. I am using ASwebauthenticationsession to provide the user a pop up browser to login. For some reason the base URL, accounts.spotify.com opens up a blank white screen for me. I have tried with other URL's and it works perfectly fine, it is only this URL that doesn't work. If theres any other way to authenticate as well, please let me know!

 

Thanks!

Hi, could you share your refresh_token code? I copied from the documentaries but it doesn't work in my app.js

Note that some browser extensions (i.e. Privacy Badger) block requests to the Spotify API endpoints thinking that they're tracking the user. Try debugging with all such extensions disabled.

The solution for me was to do the redirect with a <a href="/connect/spotify"> directly, as I was previously doing a redirect with my SPA and that caused the error.

More info here: https://stackoverflow.com/a/28629866/13522473

 


@aricooperdavis wrote:

Note that some browser extensions (i.e. Privacy Badger) block requests to the Spotify API endpoints thinking that they're tracking the user. Try debugging with all such extensions disabled.


Thank you for pointing this out. In Firefox I was getting Cors error and in Chrome I was getting HTTP error 400. Turns out it was privacy badger causing cors after all. Now I need to figure out what the Spotify documentation did wrong since I copied all their example code.

Suggested posts