Access token cannot be obtained

[todortestnow]

Library versions

• react-aad-msal: 2.3.5
• msal: 1.2.2

Describe the bug In Azure AD the application's implicit grant flow is configured to send both Access tokens and ID tokens. I installed the sample application in the project. It shows me ID token but not Access token. When i click get access token it successfully get it, but when i click get access token it fails with the error:

Unhandled Rejection (ClientAuthError): URL navigated to is xxxxxxx, Token renewal operation failed due to timeout. ClientAuthError.AuthError [as constructor] C:/test/react-aad/src/error/AuthError.ts:25 22 | var _this = _super.call(this, errorMessage) || this; 23 | Object.setPrototypeOf(_this, AuthError.prototype); 24 | _this.errorCode = errorCode;

25 | _this.errorMessage = errorMessage; | ^ 26 | _this.name = "AuthError"; 27 | return _this; 28 | } View compiled new ClientAuthError C:/test/react-aad/src/error/ClientAuthError.ts:107 104 | function ClientAuthError(errorCode, errorMessage) { 105 | var _this = _super.call(this, errorCode, errorMessage) || this; 106 | _this.name = "ClientAuthError"; 107 | Object.setPrototypeOf(_this, ClientAuthError.prototype); | ^ 108 | return _this; 109 | } 110 | ClientAuthError.createEndpointResolutionError = function (errDetail) { View compiled Function.ClientAuthError.createTokenRenewalTimeoutError C:/test/react-aad/src/error/ClientAuthError.ts:142 139 | return new ClientAuthError(ClientAuthErrorMessage.invalidStateError.code, ClientAuthErrorMessage.invalidStateError.desc + " " + invalidState + ", state expected : " + actualState + "."); 140 | }; 141 | // TODO: Is this not a security flaw to send the user the Nonce expected?? 142 | ClientAuthError.createNonceMismatchError = function (invalidNonce, actualNonce) { | ^ 143 | return new ClientAuthError(ClientAuthErrorMessage.nonceMismatchError.code, ClientAuthErrorMessage.nonceMismatchError.desc + " " + invalidNonce + ", nonce expected : " + actualNonce + "."); 144 | }; 145 | ClientAuthError.createLoginInProgressError = function () { View compiled (anonymous function) C:/test/react-aad/src/utils/WindowUtils.ts:85 82 | / 83 | WindowUtils.loadFrame = function (urlNavigate, frameName, timeoutMs, logger) { 84 | var _this = this; 85 | / | ^ 86 | * This trick overcomes iframe navigation in IE 87 | * IE does not load the page consistently in iframe 88 | */ View compiled

When i go to local browser session storage i see an object: accessToken: xxx homeAccountIdentifier: xxx idToken: xxx In this object the value of accessToken is the same like idToken.

In Redux dev tools the state for idToken is ok with all the needed data, but the state for access token is null. In the auth provider file I changed authority and clientId to the values for my app and tenant

Desktop (please complete the following information):

• OS: windows 10
• Browser chrome
• Version Version 81.0.4044.129 (Official Build) (64-bit)

[wapplegate]

I had this same problem, I assume it is by design, but it seems like the initial token request that is returned the access token mirrors the identity token. If you explicitly call the authProvider.getAccessToken(); method I have been able to receive a valid access token for my API. The reason this is happening is the initial request specifies a response_type of id_token only. If you wanted a valid access_token you need to specify token as well. Like this: response_type=id_token token

[RodFashion]

This fixed it for me: https://github.com/AzureAD/microsoft-authentication-library-for-js/issues/1199#issuecomment-575802777

Basically, make sure you have defined an URI for where your authorize call should be receiving the tokens.

[Sherif-Kayed]

I have this same issue as I am trying to access microsoft graph api using the access token but it is not returned in the first place.

If I login from the start with response_type=id_token I can't get the access token but if I put id_token+token I can get the access token.

Below is the url that I am redirected to when I try to login (I have added breaklines to be readable)

Is there a way to pass in the reponse_type to be id_token+token?

https://login.microsoftonline.com/{tenant_id}/oauth2/v2.0/authorize?
response_type=id_token&
scope={scopes}&
client_id={client_id}
&redirect_uri={redirect_uri}
&state=12345
&nonce=6789
&client_info=1&x-client-SKU=MSAL.JS&x-client-Ver=1.3.1
&client-request-id=54321
&response_mode=fragment

Edit: msal: 1.3.1 react-aad-msal: 2.3.5

[Sherif-Kayed]

I have tried downgrading from msal version 1.3.1 to 1.2.1 and now I can get the access token normally when I call authProvider.getAccessToken() So I guess the issue in my case was with msal version 1.3.1.