Can't construct an IdTokenResponse from a AuthResponse that has a token type of "access_token

[ingogbe]

Library versions

• react-aad-msal: 2.3.5
• msal: 1.4.0

Describe the bug
I got this message in the console [ERROR] Error: Can't construct an IdTokenResponse from a AuthResponse that has a token type of "access_token". when I refresh the page after I'm logged. In Redux the action AAD_ACQUIRED_ACCESS_TOKEN_SUCCESS also is fired right after AAD_INITIALIZING . I tried to track it down, and it appears to crash on the getIdToken function.

Expected behavior
The flux I use in my project is to try to get the access token only after the action AAD_LOGIN_SUCCESS is called. But I started to get the error I described above, on console, and all others steps failed too (AAD_LOGIN_ERROR, AAD_ACQUIRED_ID_TOKEN)

The expected is to complete the login when has a current session after the page is reloaded.

To Reproduce
Steps to reproduce the behavior:

1. Do the login with Azure to create the session
2. Refresh the browser page
3. The error occur

Solution:
The temporary solution I found and it worked for me, was to downgrade the msal version to the same used on this repository (react-aad), version 1.2.1

Desktop:

• OS: Ubuntu 20.04 LTS
• Browser: Chrome v84.0.4147.135

[andrea-wood]

Hello, I have the same problem

[suhadev]

I am facing the same issue. Even after downgrading msal to 1.2.1, I still face the issue. Any help would be appreciated.

[MiniMarker]

I'm also facing this issue:

Current versions:
msal: 1.4.0
react-aad-msal: 2.3.5

Current setup:

const config: Configuration = {
    auth: {
        authority: 'https://login.microsoftonline.com/common',
        clientId: 'xxx',
        redirectUri: window.location.origin,
    },
    cache: {
        cacheLocation: 'localStorage' as CacheLocation,
        storeAuthStateInCookie: true,
    },
};

const authenticationParameters: AuthenticationParameters = {
    scopes: ['https://graph.microsoft.com/User.Read'],
};

const options: IMsalAuthProviderConfig = {
    loginType: LoginType.Redirect,
};

export const authProvider = new MsalAuthProvider(config, authenticationParameters, options);

[zuitaom]

I have the same problem as well

[riisi]

Confirming that downgrading to 1.2.1 fixes it for me. Here's my config if it helps anyone.

// Msal Configurations
const config = {
  auth: {
    authority: `https://login.microsoftonline.com/${tenantId}`,
    clientId,
    redirectUri: window.location.origin,
  },
  cache: {
    cacheLocation: "localStorage",
    storeAuthStateInCookie: true,
  },
};

// Authentication Parameters
const authenticationParameters = {
  scopes: [`${clientId}/.default`],
};

// Options
const options = {
  loginType: LoginType.Popup,
  tokenRefreshUri: window.location.origin + "/auth.html",
};

export const authProvider = new MsalAuthProvider(
  config,
  authenticationParameters,
  options
);

[andrea-wood]

Is this library still maintained?

[ingogbe]

Is this library still maintained?

Idk, but the last update was 5 months ago. I'm thinking to use the Microsoft library directly instead of using this in the project I'm working on

I have the same problem as well

@MiniMarker, @andrea-wood, @zuitaom. You tried to downgrade the msal library?

---

@suhadev whats your packages versions?

[andrea-wood]

You tried to downgrade the msal library?
Yes It works but It's a temporary solution. I'm planning to use the msal library directly too if there won't be any update about this issue.

[MiniMarker]

Yeah, downgrading works for me as well.
I can live with an older version until next update.

[its-miller-time]

Hey all, I've had the same issue and at least on my end its an error on the token refresh. When the token is cached, it had the wrong token type causing a failure. Temp fix that is working for me is to set forceRefresh: true in the authenticationParameters

const authenticationParameters = {
   scopes: [clientId, etc],
   state: location.href.replace(location.hash,""),
   forceRefresh: true
}

[DangerousDetlef]

@its-miller-time Worked like a charm, thank you very much.

[SainagChunduru]

Hello All,

Force refresh and version downgrade didn't work for me.

I am facing this on refreshing the page.

[MiniMarker]

Hello All,

Force refresh and version downgrade didn't work for me.

I am facing this on refreshing the page.

Did you delete node_modules, package lock file and removed the ^ in front of the msal version in package?

[zuitaom]

@ingogbe downgrade works for me:-)

[its-miller-time]

UPDATE: In some instances the forceRefresh: true will cause an authentication failure due to a "client auth loop". This is an error returned from Microsoft when an app requests too many tokens in a short time span (details here)

Apps making multiple requests (15+) in a short period of time (5 minutes) will receive an invalid_grant error explaining that they are looping. The tokens being requested have sufficiently long-lived lifetimes (10 minutes minimum, 60 minutes by default), so repeated requests over this time period are unnecessary.

The real issue lies in the token refresh. When the silent token call caches the token, the token_type is not refreshed. This causes a conditional check to fail in this library.

react-aad/packages/react-aad-msal/src/IdTokenResponse.ts

Line 11 in 5015337

if (response.tokenType !== TokenType.IdToken) {

The real issue will be solving the token cache issue, but in the mean time, a better fix I am using is to patch the dependency directly to check if a token exists rather than for the tokenType. (You can add better logic to check if an idToken exists in the object if you want to be really safe).

if (!response.tokenType) {

This is the library I used for the patch: https://github.com/ds300/patch-package#readme

[mattiamalonni]

Temporary fix should be to downgrade the msal library to 1.3.4 in your package.json

"msal": "~1.3.0",  // run npm install

[ChristiaanScheermeijer]

I got this error after implementing the msal-browser library and switching to a different branch.

Clearing the cache or setting forceRefresh: true both helped in my case.