Angular app using MSAL library v2 shows the login page after reloading the page
See original GitHub issueCore 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:
- Created 2 years ago
- Reactions:1
- Comments:11 (5 by maintainers)
Top 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 >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@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.
@Arash-Sabet My email is available in my profile