Scopes are not returned when both id_token & token are used to make an okta request

[ErikCohenDev]

using Angular 5.
I am not able to receive the requested scopes.

according to this answer
https://support.okta.com/help/answers?id=9062A000000bmOuQAI&feedtype=SINGLE_QUESTION_DETAIL&dc=Okta_Application_Network&criteria=OPENQUESTIONS&

Scopes can only be received when either id_token or token is used
tested and received scopes after removing token from request.

---

EDIT
Referencing line:

okta-oidc-js/packages/okta-angular/src/okta/okta.service.ts

Line 103 in ec81340

responseType: ['id_token', 'token'],

[jmelberg-okta]

Hey @cohenpts:

The scopes are available via the this.oktaAuth.getAccessToken() method. You should be able to retrieve them via:

 const accessToken = this.oktaAuth.getAccessToken();
 console.log(`Scopes: ${accessToken.scopes}`);

[robertjd]

I haven't tried to reproduce, but that help link makes it sound like you get a thin access token when requesting access and ID token, and that you have to use use userinfo endpoint to get the full access token.

[ErikCohenDev]

that's corrent @robertjd the token does not have the scope information when trying to parse it with https://jwt.io/.

when sending only the id_token as the response type I get all the scope information.

@jmelberg-okta just tried it, a call to getAccessToken yields undefined.

Edit:
actually the whole tokenManager object is undefined

[jmelberg-okta]

@cohenpts I'm having a hard time reproducing this. Can you provide us with your okta-angular configuration?

const oktaConfig = {
  issuer: 'https://{yourOktaDomain}.com/oauth2/default',
  redirectUri: 'http://localhost:4200/implicit/callback',
  clientId: '{clientId}',
  scope: 'openid profile email'
}

[ErikCohenDev]

{
  issuer: "https://{myDomain}.oktapreview.com"
  clientId: "{clientId}"
  redirectUri: "http://localhost:4200"
  scope: "openid email phone address groups profile"
}

[jmelberg-okta]

Re: actually the whole tokenManager object is undefined

• Looks like there was an issue during the callback step. Tokens are automatically parsed (and stored) into localStorage by default. I'd suggest keeping your browser debugger open to see if an error is logged after your user has authenticated.

[ErikCohenDev]

no errors are logged and the token is in localstorage.
the type of token returned is the problem.

[jmelberg-okta]

Gotcha @cohenpts. This might be similar to the issue reported here.

Just to make sure I'm clear - the accessToken that is stored inside of localStorage does not have a scopes element? We store the following under oktaAuth.getAccessToken(), which is essentially localStorage.getItem('accessToken'):

• accessToken: String representation of the token
• expiresAt: When the token expires
• tokenType: Bearer
• scopes: Array of requested scopes
• authorizeUrl: Authorization endpoint
• userinfoUrl: User info endpoint

Or - are you saying the accessToken string doesn't have a scopes key in the payload? This might be because its mapped to scp instead of scopes.

In theory, oktaAuth.getAccessToken().scopes should return the requested scopes.

As a reference, I'm using the Okta Angular Samples repository to try and reproduce this issue.

[ErikCohenDev]

the token is stored in localstorage under the id okta-token-storage and not accessToken

"TOKEN_STORAGE_NAME": "okta-token-storage",

storage = storageBuilder(localStorage, config.TOKEN_STORAGE_NAME);
https://github.com/okta/okta-auth-js/blob/81775017587d772f0034d81f5cad66caec0d5439/lib/TokenManager.js#L152

the token object stored have the properties idToken and accessToken

When decrypting the token with the https://jwt.io/ tool i receive the scopes only when the
responseType: property in the okta request has just one of the items, id_token and not both id_token & token are present.

thank you both for the fast reply for this issue.

[jmelberg-okta]

@cohenpts - You're correct. I was just drawing a simple map.

I may have misunderstood your original question, so I apologize. Scopes are not bound directly to the idToken when the OAuth 2.0 response_type extends multiple token types (ex: id_token token).

The easiest way to return the attributes associated with with these scopes in the idToken is to pass your accessToken to your authorization server's /userinfo endpoint.

You can do that with this library via:

const accessToken = this.oktaAuth.getAccessToken();

// Use the underlying AuthJS library to submit the userinfo
// request using the current accessToken.
const userinfo = this.oktaAuth.getOktaAuth().token.getUserInfo(accessToken) : undefined;

Hope this unblocks you!

[ErikCohenDev]

This works, I am able to get the scope information.

Unfortunately the implementation we have requires the token to contain the scope information since we parse the token throughout our app to resolve the scope information embedded.

Is there no way to get a token containing the scope information embedded within with OktaAngular?

[jmelberg-okta]

The best way to accomplish this is to refresh the idToken. This will mint a new token with all scope attributes.

    this.oktaAuth.getOktaAuth().token.refresh(this.oktaAuth.getIdToken())
    .then((token) => console.log("New Token: ", token.idToken));

[jmelberg-okta]

@cohenpts Can you confirm this resolves your use case? If so, lets close this open issue. 😄

[ErikCohenDev]

@jmelberg-okta yes it does, thank for the help!