question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Angular app using MSAL library v2 shows the login page after reloading the page

See original GitHub issue

Core Library

MSAL.js v2 (@azure/msal-browser)

Core Library Version

2.0.5

Wrapper Library

MSAL Angular (@azure/msal-angular)

Wrapper Library Version

13.0.2

Description

I am able to log in and use the app successfully but when I refresh the page, the sign-in prompt shows up to get the user signed in. What is missing in this configuration or what should be done to prevent showing the login prompt?

MSAL Configuration

export const msalConfig: Configuration = {
    auth: {
        clientId: 'MaskedClientId', // This is the ONLY mandatory field that you need to supply.
        authority: b2cPolicies.authorities.signUpSignIn.authority, // Defaults to "https://login.microsoftonline.com/common"
        knownAuthorities: [b2cPolicies.authorityDomain], // Mark your B2C tenant's domain as trusted.
        redirectUri: 'http://localhost:4200', // Points to window.location.origin. You must register this URI on Azure portal/App Registration.
        postLogoutRedirectUri: 'http://localhost:4200', // Indicates the page to navigate after logout.
        navigateToLoginRequestUrl: true, // If "true", will navigate back to the original request location before processing the auth code response.
    },
    cache: {
        cacheLocation: BrowserCacheLocation.LocalStorage, // Configures cache location. "sessionStorage" is more secure, but "localStorage" gives you SSO between tabs.
        storeAuthStateInCookie: isIE, // Set this to "true" if you are having issues on IE11 or Edge
    },
    system: {
        loggerOptions: {
            loggerCallback(logLevel: LogLevel, message: string) {
                console.log(message);
            },
            logLevel: LogLevel.Verbose,
            piiLoggingEnabled: false
        }
    }
}

Relevant Code Snippets

No response

Identity Provider

Azure B2C Basic Policy

Source

Internal (Microsoft)

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:11 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
sameeragcommented, Dec 8, 2021

@Arash-Sabet Yes, can you please share it with @jasonnutter as he is working on this? His email is accessible in his profile. Apologies for the delayed notice.

1reaction
sameeragcommented, Dec 3, 2021

@Arash-Sabet My email is available in my profile

Read more comments on GitHub >

github_iconTop Results From Across the Web

Avoid page reloads (MSAL.js) - Microsoft Entra
Learn how to avoid page reloads when acquiring and renewing tokens silently using the Microsoft Authentication Library for JavaScript (MSAL.js).
Read more >
Angular MSAL (v2) login via redirect, redirecting 3 or more ...
The app now behaves as desired, redirecting from the Microsoft login page and loading the app immediately - no more looping reloads!
Read more >
Deep dive on using MSAL.js to integrate Angular single-page ...
Integrate an Angular single page app with the Microsoft identity platform. Integrate single sign- on and get an access token for Microsoft ...
Read more >
Redirect to a custom login page when securing your Angular ...
Using MSAL Angular and MsalGuard is the easiest way to secure your Angular app with the Microsoft Identity Platform. But if you want...
Read more >
Build A Secure Angular App Using MSAL And Azure Active ...
Step 2 - Add MSAL for Angular · Add MsalModule to imports array · Add a new method MSALInstanceFactory. Copy-paste the following code...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found