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!
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?
Yes sure you must to compile using:
ng build –optimization=true –outputHashing=a