Auth0 JWT as access token comes in only on second login

Question

I have this issue and I'm not sure whether it is a "bug" or my fault somewhere.

All of this is for a SAP on ASP.NET Core Angular which is accessing Auth0 on a hosted page.

I have updated my hosted page Auth0lock object on the hosted page to inculde a params object with a specified audience

var lock = new Auth0Lock(config.clientID, config.auth0Domain, {
  auth: {
    redirectUrl: config.callbackURL,
    responseType: 'token',
    params: {
      "audience": "https://api.webatom.com"
    }
  },
  assetsUrl:  config.assetsUrl,
  allowedConnections: connection ? [connection] : null,
  rememberLastLogin: !prompt,
  language: language,
  languageDictionary: languageDictionary,
  theme: {
    //logo:            'YOUR LOGO HERE',
    //primaryColor:    'green'
  },
  prefill: loginHint ? { email: loginHint, username: loginHint } : null,
  closable: false,
  // uncomment if you want small buttons for social providers
  // socialButtonStyle: 'small'
});

During the first login I get the usual auth result where I receive the JWT as the id_token and a short string for the access token and I don't get a message in auth0 about account access request.

During the second and other logins I get what I want. I get the message and I get the JWT as access token and id_token as null.

How do I get that second result from the start, right from the first login? Is that a bug or am I doing something wrong?

Thank you.

PS: I don't have any rules or hooks implemented at that moment.

arcseldon arcseldon · Accepted Answer · 2017-08-19T16:19:04

As a first step: Add https://jwt.io as an allowed callback to your Client, revert the Auth0 Hosted Login page back to its default (ie. remove the changes you made), then modify the url below with your own settings, and paste it into a browser URL and hit return.

https://{{YOUR_TENANT}}.auth0.com/login?client={{YOUR_CLIENT_ID}}&redirectUrl=https://jwt.io&responseType=token&connection={{YOUR_CONNECTION_NAME}}&audience=https://api.webatom.com&scope=openid

All going well, it should return a JWT Access Token and auto-populate that into the JWT.io text-area.

Next, try this - using Auth0's authorize URL instead. Again, use Auth0 default hosted login page, not the one you modified.

https://{{YOUR_TENANT}}.auth0.com/authorize?client_id={{YOUR_CLIENT_ID}}&protocol=oauth2&redirect_uri=https://jwt.io&response_type=token&scope=openid profile&audience=https://api.webatom.com&nonce=123&state=xyz

Should be same result. And presumably this is what you want every time?

If you do want an Id Token, then simply modify responseType / response_type to be token id_token.

So I would recommend you do not modify the Auth0 Hosted Login page settings for Lock directly (authentication related params..), but instead just send through the parameters you want with the request as per the /authorize endpoint above. If you have a Client application using auth0.js for example, you can set everything up at the Client and send it through when the user authenticates.

Sample snippet for auth0.js library config might be:

  auth0 = new auth0.WebAuth({
    domain: AUTH_CONFIG.domain,
    clientID: AUTH_CONFIG.clientId,
    redirectUri: AUTH_CONFIG.callbackUrl,
    audience: "https://webapi.com",
    responseType: 'token id_token', // just use token if you don't need id token
    scope: 'openid profile read:book' // read:book is a scope defined for API  
  });

Auth0 JWT as access token comes in only on second login

2 Answers