Angular 6 – ADAL Dynamic Parameter initialization

We have seen in the previous article, how to implement the ADAL Authentication in Angular 6.

Now we can see, how to do, for init the ADAL Module with dynamic parameter, for example we can take them from database, or json file configuration.

We must to open the app.module.ts
Search the “imports” line, where we have write:

@NgModule({
declarations: [
  AppComponent
],
imports: [
  MsAdalAngular6Module.forRoot({
  instance: 'https://adal.resource.com/',
  tenant: '',
  clientId: '',
  redirectUri: window.location.origin,
  navigateToLoginRequestUrl: false,
  cacheLocation: 'localStorage'
}),
RouterModule.forRoot(
 appRoutes,
 { enableTracing: true }
),
 BrowserModule,
],
providers: [
 AuthenticationGuard
]
});

As we can see, the parameter are static, now we want to take them from a web service.

We must to change the “forRoot” function, and pass a function that return the object with parameter configuration

@NgModule({
declarations: [
AppComponent
],
imports: [
    MsAdalAngular6Module.forRoot(function () {
      var request = new XMLHttpRequest();
      request.open('GET', '/api/getParameterADAL', false);
      request.send(null);

      if (request.status === 200) {
        console.log(request.responseText);
        var parameter = JSON.parse(request.responseText);
        return {
          instance: parameter.adfs_instance,
          tenant: parameter.adfs_tenant,
          clientId: parameter.adfs_client_id,
          redirectUri: parameter.adfs_redirect_uri,
          navigateToLoginRequestUrl: false,
          cacheLocation: 'localStorage',
        }
      }
    }()),
RouterModule.forRoot(
appRoutes,
{ enableTracing: true }
),
BrowserModule,
],
providers: [
AuthenticationGuard
]
});

If you have compile error build for example:
Function expressions are not supported in decorators in ‘ɵ0’

Build with:

ng build --optimization=true --outputHashing=a

Enjoy!

Cicciokr

"Javascript is to Java as hamburger is to ham; both are delicious, but they don't have much in common except a name" I'm javascript lovers and this is my site on witch sometimes write about my experience, when i have some free time, and remember: "Homo faber fortunae suae"

  1. Wojtek

    Thanks for idea, but doesn’t compile to prod with AOT. The error is “Function expressions are not supported in decorators in ‘ɵ0′”. Did you check it with prod?

Write a Comment

Your email address will not be published.