SSO between SPA apps using Azure AD and MSAL

Question

We have a a bunch of single page applications and deploying them like appA.xyz-corp.com and appB.xyz-corp.com. How do we configure Msal javascript so the user doesn't have to login to every app. We have tried the approach mentioned here https://github.com/AzureAD/microsoft-authentication-library-for-js/wiki/Sso . However session storage stores information per domain "appA.xyz-corp.com" rather than using sub domain "xyz.com". Any help is appreciated on best practices using msal.js for multiple single page apps and user sign-in seamlessly across apps.

Alex AIT Alex AIT · Accepted Answer · 2019-02-27T21:10:22

The wiki you mentioned also has some information on this scenario with multiple domains. In essence, you need to capture the preferred username and send it along with the login request. To capture the username for all applications at the same time, I would suggest storing it in a domain wide cookie that is known to all applications.

 // Store the username after login
 document.cookie = "msal_username=Paul@xyz-corp.com;domain=.xyz-corp.com;path=/"

 // use the username
 var username = getCookieByName("msal_username"); // find some code to do that
 userAgentApplication.loginRedirect(scopes, "&login_hint=" + username);

The downside of this would be that you need to implement that in all your applications.

Applications on different domain

When applications are hosted on different domains, the tokens cached on domain A cannot be accessed by MSAL.js in domain B.

Automatically select account on Azure AD

...

Using Login Hint

If you do not have SID claim configured or need to bypass the account selection prompt on interactive auth calls, you can do so by providing a login_hint and optionally a domain_hint as extraQueryParameters in the MSAL.js interactive methods (loginPopup, loginRedirect, acquireTokenPopup and acquireTokenRedirect). For example:

userAgentApplication.loginRedirect(scopes, "&login_hint=<preferred_username>&domain_hint=organizations");

You can get the values for login_hint and domain_hint by reading the claims returned in the ID token for the user.

login_hint should be set to the preferred_username claim in the ID token.

SSO between SPA apps using Azure AD and MSAL

1 Answers