Angular authentication/authorisation with Azure AD connecting to ASP.NET Core Web API

Followed countless tutorials regarding this scenario.

https://learn.microsoft.com/en-us/azure/active-directory/develop/scenario-spa-app-registration

https://learn.microsoft.com/en-us/s...-ciam-javascript-tutorial-2-call-api-angular/

We have an Angular front end, talking to an ASP.NET Core Web API.

We have set up the application in Azure as an SPA, created roles, and assigned users to those roles.

We have installed MSAL for Angular, and implemented pop up authentication. All working, and a custom guard to protect against different roles with different access..

The issue comes when accessing the API, as we would like to

1. Secure the API
2. Use the same token with the same roles etc as the Angular application

The samples above all suggested creating a secondary application within Azure, but these will have different roles and not relate to the front end.

Surely, there must be a simple way to implement this?

Continue reading...