SPA App Azure B2C Authentication with MSAL. Keep user logged in

Question

I have a SPA App (VueJS) which uses Azure B2C with MSAL to authenticate users. Authentication works just fine.

But what does not work is, that the user is not kept logged in.

As long as i use the app, everything works just fine. But when i start my app the next day i have to relogin (or just reselect the account I want to use), but I would like to have the same user experience like for example the azure portal. I can revisit the portal after one week and do not have to relogin.

How can i achieve this behavior with MSAL? Is this even possible with this library? The library uses the implicit flow.

Is there another library i can use where this works?

Answer 1

Generally, browser-based applications shouldn't keep users logged in, since activity, such as a password change or reset, at the identity provider can invalidate a persistent session and should force an interactive login.

You should consider the "keep me signed in (KMSI)" capability that has been enabled for custom policies.

Answer 2

Before the answer...

I think you'll likely need to expand on what's happening by looking at a network tracing tool. Also, as the other answer said, KMSI will help but likely isn't the only problem here. I recommend looking if the cookie is being set (check below), your app is successfully getting ID, Access tokens, and check this state in subsequent auth requests.

Basics

SSO with MSAL.js is absolutely possible and should occur without much configuration. For some background in browser-based apps implementing authentication, achieving SSO is a factor of cookies/sessions rather than tokens/token management.

How this works

When your single page app redirects the user to the Azure AD B2C sign in page and the end user successfully signs in, Azure AD will set a cookie in the browser of that end user. Then, when your app wants to get an ID token or Access token for the user (assuming the existing one from the initial sign in is expired), MSAL is able to launch a silent i-frame in the background, redirect to the Azure AD site with special query parameters (prompt=none), and utilize the cookie that was set earlier.