Spotify INVALID_CLIENT: Invalid redirect URI

I've been having some luck so far playing with spotify api using your example on Consuming REST API | Radzen Blazor Studio ... but lately have been having issues authorizing (?) https://Prototype.Psyliders.AI/MediaTech and am wondering why i can't use my own ClientId/Secret... if the ones in the example are public domain, then why can't i google them anywhere else? any suggestions how to fix so that my spotify login (?) is dependable again?

Hi @BiasBrain,

You would need to register a spotify application of your own. The credentials mentioned in our documentation are for test purposes only and the redirect URI that they support is https://localhost:5001/api/oauth/spotify/callback.

If you registered your own application set the redirect url to your app url + /api/oauth/spotify/callback e.g. https://Prototype.Psyliders.AI/MediaTech/api/oauth/spotify/callback (this assumes the data source is named Spotify).

MediaTech is just a page in my blazor application - so should the url just be "https://Prototype.Psyliders.AI/api/oauth/spotify/callback"? also, what do you mean by "data source" - the db name, or table or the Rest API connection in Radzen?

It depends on the name of the REST service. If it is Spotify - then yes.

We are talking about a REST service so db name or table isn't relevant here. I mean the value you have entered in the Name text box.


i've got a few domain redirects so i used the ultimate housing on azure as my domain... but i still can't figure out the right combination of fields to get it past "INVALID_CLIENT: Invalid redirect URI". do these look good to you or should i change?


also, how do i 'bump' radzen once this error occurs so that i have another go at entering my credentials. restarting radzen and project cleaning/rebuilding didn't work.

Try also adding https://localhost:5001/api/oauth/spotify/callback as a callback URL in the Spotify UI.

I am afraid I don't understand what you mean.

let's not worry about the bumping, i may have been confused about what's happening.

adding https://localhost:5001/api/oauth/spotify/callback as a callback URL in the Spotify UI.

...means my app runs locally, but https://psyliders.azurewebsites.net/MediaTech doesn't and produces an error in my console.

You can add multiple redirect URL in the Spotify UI. Make sure you have both localhost and your production domain based ones.

i've tried:

https://psyliders.azurewebsites.net/api/oauth/spotify/callback
https://psyliders.azurewebsites.net/MediaTech/api/oauth/spotify/callback
https://psyliders.azurewebsites.net:5001/api/oauth/spotify/callback
https://psyliders.azurewebsites.net:5001/MediaTech/api/oauth/spotify/callback
https://prototype.psyliders.ai/api/oauth/spotify/callback
https://prototype.psyliders.ai:5001/api/oauth/spotify/callback
https://prototype.psyliders.ai/MediaTech/api/oauth/spotify/callback
https://prototype.psyliders.ai:5001/MediaTech/api/oauth/spotify/callback
http://localhost:8888/callback
https://prototype.psyliders.ai:8888/api/oauth/spotify/callback
https://prototype.psyliders.ai:8888/MediaTech/api/oauth/spotify/callback
https://localhost:8888/api/oauth/spotify/callback

... without any of them working. any other suggestions? where does the callback stuff go when i publish to azure?

What does "not working" mean? In production or development?

For development you also need to add https://localhost:5001/api/oauth/spotify/callback. You don't seem to have that.

No idea what this means.


sorry about confusing questions - i'm still a newbie at c#/blazor...

the image attached is what "not working" means

... same page works locally

The actual server exception is not seen in those screenshots. Are you sure it is the redirect url? You can try checking your Azure logs for the full exception.

ok, not fixed yet but i think you're right. can i have two sqlite dbs being published wiht my publish profile? i think one of the ones i'm using on this page is not making it to the server. (sorry for the different topic in this post)


answered my own question about multiple db connections... live page still not working but i'm not finished with logs etc.

i think i've fixed some issues - i had to put this in my .csproj to make sure the sqlite dbs make it to the server:

		<None Include="first sqlite.db" CopyToOutputDirectory="Always" />
		<None Include="second sqlite.db" CopyToOutputDirectory="Always" />

... however i'm still "INVALID_CLIENT: Invalid redirect URI" whether i use my credentials or radzens on my live site.

Radzen's credentials will never work on a live site. They are only for testing and the redirect url is set to https://localhost:5001/api/oauth/spotify/callback.

The code which generates the redirect url is in the SpotifyController.cs file:

public override string RedirectUri { get => $"{Request.Scheme}://{Request.Host}/api/oauth/spotify/callback"; }

It uses the current request scheme (https or http) and then the host used to access your application. This URL has to be included in Spotify's redirect uri list. You can also see what the redirect_uri query string parameter is during authentication (it should appear in your browser's address bar but will be encoded).

By the way why are you trying to deploy the Spotify API from our documentation? Is your application using it as a business requirement or just for testing?

the application i'm still building is for my business.

https://psyliders.azurewebsites.net/MediaTech WORKS!! THANKS!!! :grinning: