How to manage multiple Tenants, ClientIDs and Endpoints with ADAL js frontend?

2
votes

Background:

  • We use a single-tenant-per-application model
  • All tenants run the same frontend and backend code that is deployed and hosted separately under different subdomains for each tenant
  • We provision separate AzureAD applications for each tenant, resulting in in a different ClientIDs for each

Problem:

As per the ADAL js wiki found here: https://github.com/AzureAD/azure-activedirectory-library-for-js/wiki/Config-authentication-context, our frontend application must specify the ClientID and backend API Endpoints when initializing ADAL.

Since each of our tenants has their own ClientID, we ended up adding all the possible ClientIDs and Endpoints into our code, and figuring out the values at runtime based on the current URL. This obviously doesn't scale very well as it requires a code change for each new tenant. We are thinking moving this work to the the CI/CD process, but are trying to understand if there is a better solution.

Is there a better way to manage multiple, single-tenant apps with ADAL js?

1
angularjsazureazure-active-directoryadaladal.js

1 Answers

0
votes

Since each instance of your application is registered separately (thus has its own ClientId), ADAL.js doesn't provide you a better solution.

You can either work with Angular Environments e. g. 

environment.tenant1.ts
enviornment.tenant2.ts

And create a build artifact for each tenant using ng build --prod ---configuration=tenant1. I don't like this solution since you have multiple build artifacts.

Or you expose a middleware / REST API that returns the configuration for a specific client by its URL. This will be the only endpoint your client needs to know. However, you have to ensure the middleware is always up (single point of failure).