Post
Ask Question

Azure AD B2C as an Identity Provider for Blazor Applications

Introduction

Azure B2C is a business-to-customer identity management service. Basically, using Azure AD B2C service, customer can use their social and local account identities to get SSO (Single sign-on) access to their applications and APIs. In this article, you will learn how to integrate Azure B2C Service with our Blazor application.

Prerequisites

  1. Azure B2C tenant
  2. Visual Studio 2022 with .NET 6 +

Before going through this blog, please learn more about Azure AD B2C here.

Azure B2C integration with Blazor

Step 1. Open Visual Studio and create a new Blazor server application, as shown in the figure below.

Blazor Server App

Step 2. Enter a project name. In my case, I have named it Blazor.App. Select the authentication type as Microsoft Identity Platform and click on Next.

You can select an Application from your B2C tenant or register a new application through the Visual Studio wizard by clicking on the Create new button from the below wizard.

Blazor app demo

Microsoft Identity Platform

Summary of Changes

Click on next. In this window, you can select the API permission. Finally, click on finish. This will install all the packages and required code into your application.

Check the API permission on the B2C application and make sure offline_access and opened permissions are granted.

App Permissions

Make sure all the B2C application information is proper in the appsettings.json file.

appsettings.json

  "AzureAd": {
    "Instance": "https://[yourdomain].b2clogin.com/",
    "Domain": "[yourdomain].onmicrosoft.com",
    "TenantId": "[your tenant id]",
    "ClientId": "[your B2C app client id]",
    "CallbackPath": "/signin-oidc",
    "SignUpSignInPolicyId": "B2C_1_SignIn_SignUp_Demo",
    "SignedOutCallbackPath": "/signout/B2C_1_susi",
    "ResetPasswordPolicyId": "b2c_1_reset",
    "EditProfilePolicyId": "b2c_1_edit_profile",
    "EnablePiiLogging": true
  },

Run the application, you will get the sign in page, if no users are added to the tenant, please sign up the user.

Sign-in Page

Blazor App

Summary

We have seen how to quickly start with the AD B2C integration with the Blazor server application. I will share more insight about the integration of Azure AD B2C with the Blazor server application in my next article.


Similar Articles