Below Microsoft documentation explains how to protect a Blazor WASM Hosted app using two different authentication approach.
1. Individual User JWT Authorization(IdentityServer)
There is a need to provide end-user with both options by combining both authentication mechanism in a single app. The user should be able to choose one of the options from the login page.
The Azure AD option is just to give end-users to SSO experience and besides that, all authorization logic will be handled locally using individual user accounts.
Once the user is authenticated using the Azure Adoption, there should be a way to link the user with a local ID to handle authorization logic etc.
I did a lot of online research but I couldn't find a guide or tutorial to implement this. I tried to implement this by combining the code but I'm stuck with:
- Enabling both Local/AzureAd login option in Blazor client login page
- Linking the Azure AD user with the local user in the server
Blazor Client Code
public class Program
{
public static async Task Main(string[] args)
{
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");
builder.Services.AddHttpClient("BlazorWasmIndvAuth.ServerAPI", client => client.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress))
.AddHttpMessageHandler<BaseAddressAuthorizationMessageHandler>();
builder.Services.AddScoped(sp => sp.GetRequiredService<IHttpClientFactory>().CreateClient("BlazorWasmIndvAuth.ServerAPI"));
//OPTION 1
//Azure Ad Authentication
builder.Services.AddMsalAuthentication(options =>
{
builder.Configuration.Bind("AzureAd", options.ProviderOptions.Authentication);
options.ProviderOptions.DefaultAccessTokenScopes.Add("api://123456/Api.Access");
});
//OPTION 2
//Individual User JWT authentication
builder.Services.AddApiAuthorization();
await builder.Build().RunAsync();
}
}