MSAL app.module.ts

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { MsalModule, MsalInterceptor } from '@azure/msal-angular';
import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
import { DemoApiService } from './demoapi.service';

export const protectedResourceMap:[string, string[]][]=[['https://localhost:44388/api/values', ['api://59b02905-8b6b-4665-a702-321e97392416/api-access']] ];

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    MsalModule.forRoot({ 
      clientID: '84750d09-7b12-4a2c-a08c-27e5fc6f51f4',
      authority: 'https://login.microsoftonline.com/160c697c-1fc7-465c-9187-67e7080382bb',
      consentScopes: [ "user.read", "api://59b02905-8b6b-4665-a702-321e97392416/api-access" ],
      protectedResourceMap: protectedResourceMap
    }),
    BrowserModule,
    HttpClientModule,
    AppRoutingModule,
  ],
  providers: [ DemoApiService, {
    provide: HTTP_INTERCEPTORS,
    useClass: MsalInterceptor,
    multi: true
  }],
  bootstrap: [AppComponent]
})

export class AppModule { }