How to combine custom permission-based authorization with MicrosoftIdentity/MSAL in Hosted Blazor WebASM

Question

As the title, i'm trying but still found no solution. This is flow: User <-> Blazor.Client <-> Blazor.Server <-> External APIs.

• Blazor.Client: MSAL Authentication
• Blazor.Server: MicrosoftIdentityWebApi Authentication

Can I use my custom Claim server to provide Permission claims to authorize users after they logging in successfully at Azure AD?

Thank you!

Below is my idea about authorization:

• Each Role has collection of Permissions: Contact.Read, Contact.Create, Posts.Create, Posts.Read, Posts.Detele, etc....
• Each User has 0-many Roles.
• Each Role can be assigned to 0-many Users.
• Each Action/Controller in Blazor.Server, and each Component in Blazor.Client is authorized or rendered by using current User Permissions.

I have searched and read many blogs, but i can do nothing except logging in at login.microsoftonline.com then redirect to my app.

Answer 1

To use custom claim server to provide permission claims make use of below PowerShell commands like below:

Create a claims-mapping policy that links specific service principals, by removing the basic claim set from tokens.

• Create a policy by using the below cmdlet

New-AzureADPolicy -Definition @('{"ClaimsMappingPolicy":{"Version":1,"IncludeBasicClaimSet":"false"}}') -DisplayName "OmitBasicClaims" -Type "ClaimsMappingPolicy"

• To get ObjectID of new policy, run the below cmdlet

Get-AzureADPolicy

• Assign the policy to your service principal by using below cmdlet

Add-AzureADServicePrincipalPolicy -Id <ObjectId of the ServicePrincipal> -RefObjectId <ObjectId of the Policy>

• To make sure whether custom claim is added or not, please run the below cmdlet

Get-AzureADServicePrincipalPolicy -Id <ObjectId of the Web API ServicePrincipal>

To add the custom permissions that are created now to your application, follow the below steps:

• Go to Azure portal -> App Registration > Your App -> Select Manifest -> set "acceptMappedClaims": true -> save
• Go to Expose an API -> set Application ID URI (api://<GUID>) to https://<yourTenantDomain> -> Update the scope

For more in detail, please refer below links:

https://github.com/Azure-Samples/active-directory-dotnet-desktop-msgraph-v2/issues/50#issuecomment-598429976

https://learn.microsoft.com/en-us/azure/active-directory/develop/active-directory-claims-mapping#omit-the-basic-claims-from-tokens

Answer 2

After hours of searching and working, i decided to use Backend For Frontend pattern to handle user authorization. For custom claims to handle security role, i injected OpenIdConnect & Cookie to Server service to connect to Azure AD first, then add more claims when options.Events.OnTokenValidated event of AddOpenIdConnect(OpenIdConnectDefaults.AuthenticationScheme, options)