React MSAL - Silent SSO could not be completed, when token expired

Library

• msal@1.x.x or @azure/msal@1.x.x
• @azure/msal-browser@2.x.x
• @azure/msal-node@1.x.x
• @azure/msal-react@1.x.x (Alpha 1)
• @azure/msal-angular@0.x.x
• @azure/msal-angular@1.x.x
• @azure/msal-angular@2.x.x
• @azure/msal-angularjs@1.x.x

Framework

• Angular
• React
• Other

Description

I am developing react app and authenticating user against AAD B2C using react msal library. I was able to make the authentication working and I am able to acquire token silently, however I am facing issue when original token expires:

BrowserAuthError: silent_sso_error: Silent SSO could not be completed - insufficient information was provided. Please provide either a loginHint or sid.

I assume this has something to do with token not being refreshed. Is there anything I should do explicitly, so that token gets refreshed?

Error Message

BrowserAuthError: silent_sso_error: Silent SSO could not be completed - insufficient information was provided. Please provide either a loginHint or sid.

MSAL Configuration

const tenant = "mytenant.onmicrosoft.com";

const signInPolicy = "B2C_1A_signup_signin";
const applicationID = "<appid>";
const reactRedirectUri = "http://localhost:1234/home";
const tenantSubdomain = tenant.split(".")[0];
const instance = `https://${tenantSubdomain}.b2clogin.com/`;
const signInAuthority = `${instance}${tenant}/${signInPolicy}`;// Msal Configurations
const authorityDomain = "mytenant.b2clogin.com"
// Config object to be passed to Msal on creation
export const msalConfig = {
  auth: {
      clientId: applicationID,
      authority: signInAuthority,
      knownAuthorities: [
        authorityDomain
      ]
  }
};

export const loginRequest: RedirectRequest = {
  scopes: ["https://mytenant.onmicrosoft.com/api/read"]
};

Reproduction steps

Login using sample code Wait for 24 hours for token to expire Issue appears

    React.useEffect(() => {
        if (account && inProgress === "none")
            instance.acquireTokenSilent({
                ...loginRequest,
                account: account
            }).then((response) => {
                ...
            })

    }, [account])

Expected behavior

AcquireTokenSilently would acquire the token

Identity Provider

• Azure AD
• Azure B2C Basic Policy
• Azure B2C Custom Policy
• ADFS
• Other

Browsers/Environment

• Chrome
• Firefox
• Edge
• Safari
• IE
• Other (Please add browser name here)

Regression

• Did this behavior work before? Version:

Security

• Is this issue security related?

Source

• Internal (Microsoft)
• Customer request

[code-by-gijs]

Just to add on to what @tnorling has said, the auth server will send a new refresh token when you use one to renew an access token. So if you call acquireTokenSilent at least once every 24 hours, your application will not perform an interactive flow. The only time you will need to handle the acquireTokenSilent failure with an interactive call is if it has not been called within 24 hours of a token retrieval or renewal.

Nope, you can refresh a token for 24 hours, after those 24 hours, you cannot refresh your token anymore. It is not a rolling window for a SPA. So every 24 hours you will have to perform an interactive flow.

[code-by-gijs]

The accesstoken will always expire after 24 hours, even if you refresh your tokens. There is no rolling window. This is how the flow works within a SPA. As @tnorling explained, you should trigger an interactive flow when acquireTokenSilent fails.

offtopic: I really hope this will be changed within b2c… It’s really hard to create a user friendly app when your token expires every 24 hours.