Announcements

INVALID_CLIENT: Invalid redirect URI

Solved!

INVALID_CLIENT: Invalid redirect URI

joanofsnark

I am following the Quick Start tutorial, which instructs:

 

To try the app, replace these credentials with the values that you received when you registered your app. In this demonstration app we use http://localhost:8888/callback as the redirect URI.

 

I put in my Client ID and Client Secret, and tried using the above URI. Index.html loads, but when I click the button, I get the following error:

 

INVALID_CLIENT: Invalid redirect URI

 

I've tried what solutions I could find on the web, but nothing has worked for me. How do I resolve this? What am I supposed to put as the redirect URI in order to get the login prompt to load? Thank you!

Reply

Accepted Solutions
Marked as solution

ohej

Hi and welcome to the forum!

 

You will need to setup the callback URL in the settings for your app on the Developer Dashboard.

 

Simply log in, find your app and click "Edit Settings" in the top right section. Under redirect URIs you ad http://localhost:8888/callback and remember to click save in the bottom. This should resolve your issue.

View solution in original post

13 Replies
Marked as solution

ohej

Hi and welcome to the forum!

 

You will need to setup the callback URL in the settings for your app on the Developer Dashboard.

 

Simply log in, find your app and click "Edit Settings" in the top right section. Under redirect URIs you ad http://localhost:8888/callback and remember to click save in the bottom. This should resolve your issue.

joanofsnark
Oh, wow.. thank you so incredibly much! I spent a whole bunch of time trying to figure this out and somehow COMPLETELY missed this. I even went into the ‘Edit Settings’ menu. 🤦‍♀️😆

Thank you so much — I’m stoked to try to build my little app and since I’m a bit of a n00b, I need the tutorials. 💪

ohej
I'm glad to hear it solved your problem. Happy coding! 🙂

Seph-R

Any chance someone can put in a tiny docs edit PR for this?

It would be really nice if it mentioned this step right next to...


To try the app, replace these credentials with the values that you received when you registered your app. In this demonstration app we use http://localhost:8888/callback as the redirect URI.




ohej

Hi @Seph-R 

 

We are in the process of updating the WebAPI guide, we'll make sure to cover this in the next iteration 🙂 

joanofsnark

Thank you! I’m kind of a n00b, so all the help I can get, y’know? 😅

Michaeljh-23

Thank you! This was a major help to me as well. After adding that to my development dashboard, I ran into a secondary bug I've been on for a few hours. My browser claims that 

 

localhost refused to connect. 

error code : crbug/1173575, non-JS module files deprecated.

 

I was able to authenticate my Spotify, then the attempt to redirect or follow through with the authorization led to this ^^ error. 
I am still on the page localhost:8888/auth/callback?code=theBufferStringXxxxXxxXxXx. 

 

Unsure on where my issue may lie, but praying you may be able to help! Thanks for any tips you may have ❤️

 

 

Monedula_

I struggled a bit with this; and I would like to add some content. Adding a port number might work, but it is completely random and 8888 might not.

The thing is that no 2 applications running a website on your pc (localhost) can have the same number. So when installing your application (in my case Audioband) you configure that use a unique port number. I would recommend a random number in the 8000-range like 8227 or 8239, whatever. This will avoid conflicts.

 

The application you are using is now calling a website with a redirect uri. In the address bar you will see something like: '...redirect_uri=http://localhost:8227/&scope=...'

This url needs to be exactly what is in your spotify settings for the callback url. So in this case there is a / behind the portnumber; add a redirecturl: 'http://localhost:8227/' even though the website itself is 'http://localhost:8227' (without the /).
Mind you; If the url would look like this '...redirect_uri=http://localhost:8227/callback&scope=...' the redirect uri in the spotify configuration should read 'http://localhost:8227/callback'

2592b78a3eprjen2p91l

Hi,

I have already setup everything. Everything was working perfectly till few months ago. Suddenly, I am getting this error even without changing anything in code. 
 

cwhelan4

Hi! I have added redirect URIs to the whitelist in my app dashboard and am still getting INVALID_CLIENT: Invalid redirect URI when I try to run the app. I've tried so many variations of the redirect URI and nothing is working. Right now I have:

http://localhost:5000/redirect/ 

http://localhost:8888/callback 

http://localhost:8888/callback/  

  

None of these seem to be working.

I am using spotipy and flask. Please help!!

tdza

Was having similar problem, it worked perfectly and then got "INVALID_CLIENT: Invalid client". 

 

Solved by checking the URL and saw that "%22" was in front and after the client ID. By removing this I was able again to authenticate. %22 was added by it self after I put the client id in info.plist

kanwar-ammar

I have deployed to my website to some other url and also added it to the dashboard I'm having the error of Invalid_token on the browser and Invalid redirect URI in the backend server while calling callback api

athifongoqa

any solution to this?

Suggested posts

Env: prod