react-aad
react-aad copied to clipboard
"Token renewal operation failed due to timeout."
Describe the bug I am using react-aad-msal with AzureAD B2C. I have configured authProvider with b2c changes
const config = { auth: { authority: 'https://<Tenant>.b2clogin.com/<Tenant>.onmicrosoft.com/B2C_1_google', clientId: ApplicaitonID, redirectUri: 'http://localhost:3000/home', postLogoutRedirectUri: 'http://localhost:3000/home', validateAuthority: false
}, cacheLocation: "sessionStorage", storeAuthStateInCookie: true };
const authenticationParameters = { scopes: [ "openid", "https://<Tenant>.onmicrosoft.com/webapi1/demo.read", "https://<Tenant>.onmicrosoft.com/webapi1/user_impersonation"
] }
I am able to successfully login using LoginType.Redirect and Google. The Redux store changes the state to authenticated and display id token. However in approximately 6 seconds it redirects back to the home page with this error, Also, the accessToken is null.
errorCode(pin):"token_renewal_error" errorMessage(pin):"Token renewal operation failed due to timeout." name(pin):"ClientAuthError" type(pin):"AAD_ACQUIRED_ACCESS_TOKEN_ERROR"
I would appreciate any helpful pointers to this problem.
I've seen this same issue surfaced today as well for other users. Seems there's an issue logged for it already on MSAL side of things: https://github.com/AzureAD/microsoft-authentication-library-for-js/issues/1009
Received an update from MSAL that the team is investigating this and they are working with teams who are experiencing similar timeouts.
Thanks Andrew
@AndrewCraswell Now that MSAL team says a fix is available in beta package, is this something you can update this package with to test? Thanks
I pushed a new version with the latest beta 3. I'm still seeing reports from others that it's not resolved though. For my scenario, we learned we were using the getIdToken() token which was requesting a new token too frequently and the requests were being blocked. The answer was to (a) rely more on access tokens or (b) implement better Id Token caching on our client-side.
I pushed the latest Beta 4, which is supposed to resolve this issue I believe. For my own projects, I am no longer encountering this issue so I can't speak for others.
In our situation, we had been using IdTokens to secure our own APIs since we owned the app, the backend, and the API. We found, however, that making too many requests for IdTokens (we validate the token before making API requests) was causing the upstream authentication system to blacklist the client and return a timeout error. The solution was to switch to access tokens, using a custom scope against Azure AD. This was a reasonable workaround for us since we really ought to have bene using Access Tokens from the beginning.
After updating, please let me know if this is resolved. If I don't hear anything for a few weeks I'll auto-close.
I have updated my project and see this error

so not able to request access token so far. any suggestions?
I would post a new issue on the MSAL repo to make sure you're not dealing with an edge case they aren't aware of. Since you're still able to repo, I'll keep this issue open. https://github.com/AzureAD/microsoft-authentication-library-for-js
sorry, I will take it back.. I was able to get this working by adding my local domain as authorized Javascript origins.
okay.. this is becoming more confusing now.. I started getting the error again.. so I have updated react-aad-msal to 2.1.1 and did some testing.
with [email protected]
Both google and microsoft account are throwing errors.
Microsoft account:

Google account:

with [email protected]
Google works fine.
Microsoft account fails

with [email protected]
This is the real surprise. Both accounts are working fine now :)
Only difference is I do not have my domain added to google authorized javascript origins when I faced this issue a while ago.
So with all this, not sure what is going on.
Hmmm, yeah, I was hoping listing the msal library as a peerDependency would give the flexibility to roll back to a specific version or beta of msal. I've been feeling dirty about releasing a new version of our library Everytime someone requests the latest preview or beta.
I will keep this issue open while we track against the issue created on msal's GitHub
I have the same issue, I'm working with redux and I have the following response object on Redux Store:
{
"errorCode": "token_renewal_error",
"errorMessage": "URL navigated to is https://ndevbmi.b2clogin.com/ndevbmi.onmicrosoft.com/b2c_1_signin_signup_autogestionbrokers/oauth2/v2.0/authorize?response_type=id_token&scope=https%3A%2F%2FndevBMI.onmicrosoft.com%2Fapibroker%2Fuser_impersonation%20openid%20profile&client_id=39bb31d8-efa3-4658-a6bd-a8ddb26a7f0f&redirect_uri=http%3A%2F%2Flocalhost%3A3000&state=cd61cc5d-213a-4cfc-a3f3-f35bbdf2b1aa&nonce=b9bbf0fa-0526-4b07-aea6-ed8fd1b7167a&client_info=1&x-client-SKU=MSAL.JS&x-client-Ver=1.2.1&client-request-id=ef1d9b69-2071-4f2d-a906-edbc73472819&response_mode=fragment, Token renewal operation failed due to timeout.",
"name": "ClientAuthError"
}
What should be the solution?
Maybe there is a solution on new releases?
Hey @brayanL, the error you have is saying the MSAL blocked a page navigation from occuring. Seems the AAD was trying to redirect to an error page, but MSAL prevented that. If you copy the full authorize/... URL in the error and go to that link, you will see the real error message. It's usually a configuration issue in the Azure AD app.
It's pretty confusing to be sure, but it's a current limitation on MSAL.
I am having the same error now
Also having 1 network error
auth.html cancelled request
Manually, this issue can be solved by clearing the site data.
Does anybody know how to "clear site data" through javascript?
@bldulam1 this ?
localStorage.clear();
sessionStorage.clear();
i switch back to msal and based myself on their react example project which was updated few days ago
I am still facing same issue , has anyone managed to solve it
i can confirm even with msal i have the issue
But it is just in some cases