ASP.NET Core 8 Blazor United – How to use Azure B2C? – Blazor

by
Liam Thompson
.net-8.0 azure-ad-b2c blazor

Quick Fix: To integrate Blazor Web Assembly into a Blazor United Project, one must install Microsoft.AspNetCore.Components.WebAssembly.Server NuGet Package and add the reference of Blazor Web Assembly App to Blazor Web App. Then, in the Connected Services, add the Microsoft Identity Platform, select the Tenant ID related to Azure ADB2C and configure the necessary permissions.

The Problem:

In ASP.NET Core 8 Blazor United, integrating Azure B2C for user authentication seems to be different from the previous ASP.NET Core 7 Blazor server-side approach. It’s challenging to find relevant code samples or documentation explaining how to configure Azure B2C in this new Blazor model.

The Solutions:

Solution 1: Configure Blazor United Project with Azure B2C

  1. Create Blazor Web App and Blazor WebAssembly App:

    • Start by creating a new Blazor Web App with .NET 8.0 Preview version.
    • Then, add a new Blazor WebAssembly App with .NET 8.0 Preview version to the solution.
    • Select "Microsoft Identity Platform" as the Authentication type.
  2. Integrate Blazor WebAssembly App into Blazor United Project:

    • Install the "Microsoft.AspNetCore.Components.WebAssembly.Server" NuGet Package in the Blazor WebAssembly App.
    • Add a reference from the Blazor Web App to the Blazor Web Assembly App.
  3. Configure Microsoft Identity Platform:

    • In the Blazor United Project, navigate to "Connected Services" and add "Microsoft Identity Platform."
    • Select the appropriate Tenant ID and create a new App in Azure ADB2C.
  4. Configure Permissions:

    • Follow the Microsoft documentation to configure the necessary permissions for the Azure B2C integration.
  5. Additional Resources:

    • Refer to the updated Microsoft documentation for version 8 (once available) for more detailed guidance.
    • The BlazorHelpWebsite provides clear steps for configuring B2C in older versions, which can be helpful for understanding the general process.

Q&A

How to Integrate Blazor United Project with Azure B2C for Authentication?

Use the ‘Microsoft Identity Platform’ from ‘Connected Services’ and select the ‘Tenant ID’ related to Azure ADB2C to register a new app in your tenant.

Can you use code samples from ASP.NET Core 7 for Blazor United in ASP.NET Core 8?

No, ASP.NET Core 7 Blazor Server-side code samples cannot be used in Blazor United of ASP.NET Core 8.

How can I Configure Permissions for Authentication with ADB2C in Blazor United?

Follow the Microsoft Documentation to configure the required permissions for Azure ADB2C integration.

Video Explanation:

The following video, titled "How to Secure a Blazor WebAssembly App Using Azure Active ...", provides additional insights and in-depth exploration related to the topics discussed in this post.

Play video

In this video, I'll guide you through the step-by-step process of securing your Blazor WebAssembly app with Azure Active Directory.