Error in Angular MSAL AuthError: Unexpected error in authentication.: Hash does not contain state

1
votes

I m successfully creating users in B2C using graph api. Once a user is created I want to send email to users to reset password (using the password reset link below)and then login to the angular web app using MSAL 1.3.2. I have created b2c password reset policy in Azure B2C instance. I click on Run the user flow to test it. The Url (which I want to email) looks like

https://tenant.b2clogin.com/tenant.onmicrosoft.com/oauth2/v2.0/authorize?p=B2C_1_passwordreset1& client_id=xxxxxxxxxxxxxxxxxxxxxxxxxxxxx&nonce=defaultNonce&redirect_uri=http://localhost:4203&scope=openid&response_type=id_token&prompt=login

I successfully reset password and then redirected to the app with an Id token like below in the browser address bar

http://localhost:4203/#id_token=eyJ0eXAiOiJKxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

My angular app which I have configured using MSAL could not process this and I get an error in the console

ERROR AuthError: Unexpected error in authentication.: Hash does not contain state.

My b2C config looks exactly like this in sample

Any suggestions?

2
angularazure-ad-b2cmsal
What browser are you using? – Carl Zhao
@Carl its Google chrome – rumi

2 Answers

2
votes

This issue occurs when you send the user directly to B2C without initialising MSAL in the app first. MSAL always passes a state parameter in its request to the auth endpoint and expects it returned back with the tokens, where it then confirms the state is the same as sent in the initial request.

So this will always occur when using the run now link from the portal with the reply url set to your app. Use https://jwt.ms as a reply url instead or initiate the flow through your app so MSAL is properly initialised.

-1
votes

As far as I know, some browsers will get this error because of the limitation of the URL length. Try to set storeAuthStateInCookie to "true" to save the cache in a cookie to resolve the trusted zone restriction in the browser.

export const msalConfig: Configuration = {
    auth: {
        clientId: "e760cab2-b9a1-4c0d-86fb-ff7084abd902",
        authority: b2cPolicies.authorities.signUpSignIn.authority,
        redirectUri: "http://localhost:6420/",
        postLogoutRedirectUri: "http://localhost:6420/",
        navigateToLoginRequestUrl: true,
        validateAuthority: false,
      },
    cache: {
        cacheLocation: "localStorage",
        storeAuthStateInCookie: true, 
    },
}

Or try using another browser.