Search code examples
azureauthenticationazure-active-directorymulti-tenantazure-ad-msal

Multi-Tenant Azure Active Directory application with Msal for Angular 6

We are developing a SPA (Single page application) that any user with a valid Azure account can use. The app uses permissions such as Azure Resource Management (user_impersonation) for showing statistics and monitoring some Azure resources.

The application is built with Angualr 6+ and we are using the latest version of Msal-Angular for authentication. (the rxjs-compact package is installed for supporting angualr 6+)

I've already registered an App Registration in Azure (multi-tenant) with the configured permissions, but I'm having trouble configuring Msal-Angular for supporting Multi-Tenancy.

Our configuration works for organizational users but not for personal accounts that are not in my Active Directory. 

MsalModule.forRoot({
  clientID: environment.aadClientId,
  redirectUri: environment.redirectUri,
  authority: 'https://login.microsoftonline.com/organizations/',

  protectedResourceMap: [['https://management.azure.com/', ['https://management.azure.com/.default']]]
})

If I try to change the authority to 'common' as in the following:

'https://login.microsoftonline.com/common/'

The login works, but the scopes are not acquired correctly and any attempt to access a secure API such as 'https://management.azure.com/' yields the following error:

ERROR The provided value for the input parameter 'scope' is not valid. The scope 'https://management.azure.com/.default openid profile' does not exist.|invalid_scope

Am I doing something wrong? Is this possible to implement with Msal-Angular or should I use Msal Core?

Solution

  • To allow personal account to login, you need to use common endpoint https://login.microsoftonline.com/common/.

    And the supported account type must be "Accounts in any organizational directory (Any Azure AD directory - Multitenant) and personal Microsoft accounts (e.g. Skype, Xbox)"

    enter image description here

    However: https://management.azure.com api is not supported when you use common endpoint and personal accounts. You can only use multi-tenant users here.