I have a React App that uses the oidc-client.js library to authenticate users against IdentityServer. This all works well and have no issues.
I would like to switch to Auth0 using the same setup. For the most part this all works and I am able to login and retrieve the id_token, however I do not receive the access_token. there is a ± 12 char value in the access_token field but this does not pass any form of token validation.
I’ve tried changing the response_type to “token id_token” but no difference. I’ve included my Api, that is registered on Auth0, into the scope, but still no access_token.
Any ideas on how I can retrieve the access_token and id_token, at the same time/login?
I’ve found a few similar topics here, but nothing that has resolved the issue for me:
The other big issue I have is logout. It seems that Auth0 does not report a logout URL. I can however set this inside the metadata and get logout working successfully.
I’ve tried changing the response_type to “token id_token” but no difference.
Sounds right.
Have you tried the React Quickstart? It returns ID and Access Token by default, as you can see from my screenshot below (filtered the request to the token endpoint of my Auth0 tenant). Maybe it helps to take a look at it.
I’ll try the react sample to see what I get. The access token in the response I receive looks similar to yours from your screenshot, however, I am not able to pass that to my API. My API says that it is not a valid token and testing it on jwt.io also does not provide any useful info. I am expecting a token roughly the same size/style as the id_token, but for my API.
If the Access Token is not of the similar length/format than your ID Token but just a short string as in my screenshot, then you’re not passing an audience parameter in the authorization request - which makes Auth0 return an opaque access token (instead of a JWT) that is only valid for the Auth0 /userinfo endpoint but not for anything else, such as your own resource server / backend / API.
You need to register your API in Auth0 in the Dashboard > APIs, give it any unique identifier, then use this identifier as audience parameter in the request from within your React app.
See this second tutorial:
Note that our 01-Login Quickstart only demonstrates a login / authentication, but no API authorization, which is why our 01-Login doesn’t use the audience. So don’t let that confuse you. You’d need to follow further what’s shown in the 02-Calling an API quickstart.
ok, thanks for the info. I did see mention of using the audience parameter, but could not find any examples of this. I’ll try the getTokenSilently, sounds like that will do the trick.