Redirecting Users with State Parameters

Hello,

I’m trying to redirect my users after login/signup in a React app. I’ve been reading about how to do that using a state param in the authentication request using a nonce per these docs.

(https://auth0.com/docs/protocols/oauth2/redirect-users)

My question is concerning this quote:

As part of the callback processing and response validation

Where is this callback processing done? I have a callback handler but no information is passed to it. So, how do I validate a response? Where is this response data that I can evaluate?

FYI: I am using the react-auth0-spa.js context provider as described here : https://auth0.com/docs/quickstart/spa/react

Hi,

auth0-spa-js validates the response automatically so you needn’t concern yourself with this. The library takes care of all of these low-level details.

Regardless, I will explain how this works internally:

When the /authorize URL is constructed a new transaction is created and associated with a newly generated state value that will be passed in the URL: https://github.com/auth0/auth0-spa-js/blob/c757764b94cb1561c37b20cf6076c73c7ceef317/src/Auth0Client.ts#L133

When the user is redirected back to your app you should be calling handleRedirectCallback. This function retrieves the transaction using the state value from the query parameters: https://github.com/auth0/auth0-spa-js/blob/c757764b94cb1561c37b20cf6076c73c7ceef317/src/Auth0Client.ts#L282

It then passes the transaction’s nonce to _verifyIdToken (which is just a wrapper around the verify function) : https://github.com/auth0/auth0-spa-js/blob/c757764b94cb1561c37b20cf6076c73c7ceef317/src/Auth0Client.ts#L317

In verify you can then see the nonce value from the transaction is compared with that of the ID token. If they don’t match then validation fails: https://github.com/auth0/auth0-spa-js/blob/c757764b94cb1561c37b20cf6076c73c7ceef317/src/jwt.ts#L135

1 Like