API authentication using Auth code flow

Get Help
,
1

I am trying to authenticate an API using Auth code flow. I have followed the Hello World React Example along with Hello World Node Express API. The React APP user authentication is working correctly, but when I try to integrate the API call using the React App the access token is not validated by the Auth Server.

I have tested the API using Machine to Machine client credential flow and its working fine. The React App is calling the method “getAccessTokenSilently()” I checked that it is getting a access token but its not accepted by the API server.

Please note the Access Token received through client credential flow shows proper data in JWT validator, but the access token received through Auth code flow seems incorrect. The JWT validator says signature mismatch.

Access token through Client Credential Flow

correct_access_token
correct_access_token582×761 44 KB

Access token through Auth Code Flow

incorrect_access_token
incorrect_access_token570×713 29.8 KB

I am not sure why my protected API is not accessible through Auth code flow.

3

Hey there @roy.manotosh welcome to the community!

You’ll notice that the access token shared from the auth code flow isn’t decoded - This is due to the fact that the when authenticating via the auth code flow there is no audience param being passed and thus the access token returned is opaque.

For auth0-react in particular you will need to pass an audience param as a part of AuthorizationParams in Auth0Provider. Once the audience is included, you should be able to decode the access token returned at jwt.io and your API should be able to validate it as well.

4

Yes, I could figured that out on my own. Thanks a lot for the clarification. The example doc do not mention it clearly. When I went through the Access Token documentation I realised that Audience parameter need to be passed.

It worked. Thanks.

5

Great! Glad to hear you got it sorted :slight_smile: