Today i want to talk to you about Microsoft ADAL (Azure Active Directory Authentication Library).
ADAL allows users to authenticate in Active Directory (AD) local or in the cloud and take token to protect the API.

How can i do to integrate it in a Angular 6 app?

1) Install the js library microsoft-adal-angular6

npm i microsoft-adal-angular6

2) Open app.component.ts
2.1) Import the microsoft adal

import { MsAdalAngular6Service } from 'microsoft-adal-angular6';

2.2) In the export class AppComponent change the constructor

export class AppComponent {
title = 'APP Title';
constructor(private adalSvc: MsAdalAngular6Service) {
console.log(this.adalSvc.userInfo);
var token = this.adalSvc.acquireToken('http://adal.resource.com').subscribe((token: string) => {
console.log(token);
});
}
}

3) Open app.module.ts
3.1) Import the microsoft adal

import { MsAdalAngular6Module, AuthenticationGuard } from 'microsoft-adal-angular6';

3.2) We must to change our routes

const appRoutes: Routes = [
{ path: '', component: AppComponent, pathMatch: 'full', canActivate: [AuthenticationGuard] }
];

3.3) In NgModule import library

@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
]
});

If you want an example Angular 6 ADAL App click here.

11 Comments

  1. it does not automatically attach bearer token in api call like adal-angular.. any tips?

  2. @Nilendra you can create a function that you call in witch you can attach on the query string / param the token!

  3. Hello, I tried the code in github, and (after some problems of libraries solved) it goes directly to an error page of Microsoft :
    AADSTS90013: Invalid input received from the user.

  4. @Hugo Carpentier when you go on your application, appear the page of ADAL Microsoft with the Login form?

  5. Just user want load specific page like baseurl/products
    So user type baseurl/products then signing will happen but the user redirect to the root link of the app but not the baseurl/products that user requested.

    How it can be solved?

  6. If i leave my system idel for about 10 min the i get access token as null adn thus i think i get error “Token renewal failed due to timeout”

    What can be the issue?
    please help

Leave a Reply

Your email address will not be published.