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.
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.
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.
