Auth0 callback URL mismatch Auth0 callback URL mismatch reactjs reactjs

Auth0 callback URL mismatch


Please ensure two things:

1). In your react app code

 responseType: 'code'

2). On the Auth0 dashboard, under Settings -> Allowed Callback URLs put your callback entry (localhost:3000/upload) - which I think you have done but just in case.

enter image description here

Let me know if you are still having problems.


To cause a redirect to a different URL after a successful authentication, you need to provide the redirectUrl to Lock, like this:

// Configure Auth0 const options = { allowedConnections: ['linkedin'], auth: { responseType: 'code', redirectUrl: 'http://localhost:3000/upload' } };
this.lock = new Auth0Lock(clientId, domain, options)

(Also notice that the responseType option goes under auth, not under auth.params.)

If you do the redirect, you won't reach the event handler you defined in your login page. You will need to either add an event handler in your destination page (and use responseType:token) or handle authentication results in your server code (this is what you will normally be doing if you are requesting a responseType: code).


Make sure that there is no special hidden characters or space between the commas between the URLs when you paste it into the Auth0 Setting site. I didn't realise about this util I put every urls into Vim to check and see that there are such above cases