Angular WebAPI AzureAD snippets

app.component.ts

export class AppComponent {
  constructor(private adal: AdalService) {
    this.adal.init(environment.adalConfig);
  }
  signOut(): void {
    this.adal.logOut();
  }
}

app.module.ts

@NgModule({
  declarations: [
    AppComponent,
    AuthCallbackComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    AppRoutingModule
  ],
  providers: [
    AdalService,
    { provide: HTTP_INTERCEPTORS, useClass: AdalInterceptor, multi: true }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

appSettings.json

{
  "AzureAd": {
    "Instance": "https://login.microsoftonline.com/",
    "Domain": "your AD domain (either custom or .onmicrosoft.com)",
    "TenantId": "Azure AD Directory ID",
    "ClientId": "Registered App (angular-aad-api)"
  }
}

auth-callback.component.ts

export class AuthCallbackComponent implements OnInit {
    constructor(
        private router: Router,
        private adal: AdalService,
        private zone: NgZone) { }


    ngOnInit() {
        this.adal.handleWindowCallback();

        setTimeout(() => {
            this.zone.run(
                () => this.router.navigate(['/'])
            );
        }, 200);
    }
}

auth.guard.ts

@Injectable({
providedIn: 'root'
})
export class AuthGuard implements CanActivate {
  constructor(private adal: AdalService) { }
  canActivate(): boolean {
    if (this.adal.userInfo.authenticated) {
      return true;
    }
    this.adal.login();
    return false;
  }
}

controller.cs

[Authorize]
[Route("api/[controller]")]
[ApiController]
public class ValuesController : ControllerBase
{
    // GET api/values
    [HttpGet]
    public ActionResult<IEnumerable<string>> Get()
    {
        return new string[] { "value1", "value2" };
    }
}

environment.ts

export const environment = {
  adalConfig: {
    tenant: 'The Azure AD Directory ID',
    clientId: 'The Registered Angular App Application ID',
    redirectUri: "The successful login URL (http://localhost:4200/auth-callback)",
    postLogoutRedirectUri: "The successful logged out URL (http://localhost:4200/logged-out",
    endpoints: {
      "The URL which will access this app": "The Registered Web API Application ID"
    }
  }
};

Startup.cs

public void ConfigureServices(IServiceCollection services)
{
    services.AddAuthentication(AzureADDefaults.BearerAuthenticationScheme)
        .AddAzureADBearer(options => Configuration.Bind("AzureAd", options));

    services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2);

    services.AddCors(options =>
    {
        options.AddPolicy("AllowAllOrigins", builder =>
        {
            builder.AllowAnyMethod().AllowAnyHeader().AllowAnyOrigin();
        });
    });

}

// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseAuthentication();
    app.UseCors("AllowAllOrigins");
}