AspNetCore.Docs/aspnetcore/security/authentication/azure-ad-b2c.md

8.2 KiB
Raw Blame History

title author description ms.author ms.custom ms.date uid
Cloud authentication with Azure Active Directory B2C in ASP.NET Core camsoper Discover how to set up Azure Active Directory B2C authentication with ASP.NET Core. casoper devx-track-csharp, mvc 07/22/2021 security/authentication/azure-ad-b2c

Cloud authentication with Azure Active Directory B2C in ASP.NET Core

By Damien Bod

Azure Active Directory B2C (Azure AD B2C) is a cloud identity management solution for web and mobile apps. The service provides authentication for apps hosted in the cloud and on-premises. Authentication types include individual accounts, social network accounts, and federated enterprise accounts. Additionally, Azure AD B2C can provide multi-factor authentication with minimal configuration.

[!TIP] Microsoft Entra ID, Microsoft Entra External ID and Azure AD B2C are separate product offerings. An Entra ID tenant generally represents an organization, while an Azure AD B2C tenant or a Microsoft Entra External ID tenant can represent a collection of identities to be used with relying party applications. To learn more, see Azure AD B2C: Frequently asked questions (FAQ).

[!TIP] Microsoft Entra External ID for customers is Microsofts new customer identity and access management (CIAM) solution.

In this tutorial, you'll learn how to configure an ASP.NET Core app for authentication with Azure AD B2C.

Prerequisites

Preparation

  1. Create an Azure Active Directory B2C tenant.

  2. Create a new ASP.NET Core Razor pages app:

    dotnet new razor -o azure-ad-b2c
    

    The previous command creates a Razor pages app in a directory named azure-ad-b2c.

    [!TIP] You may prefer to use Visual Studio to create your app.

  3. Create a web app registration in the tenant. For Redirect URI, use https://localhost:5001/signin-oidc. Replace 5001 with the port used by your app when using Visual Studio generated ports.

Modify the app

  1. Add the Microsoft.Identity.Web and Microsoft.Identity.Web.UI packages to the project. If you're using Visual Studio, you can use NuGet Package Manager.

    dotnet add package Microsoft.Identity.Web
    dotnet add package Microsoft.Identity.Web.UI
    

    In the preceding:

    • Microsoft.Identity.Web includes the basic set of dependencies for authenticating with the Microsoft identity platform.
    • Microsoft.Identity.Web.UI includes UI functionality encapsulated in an area named MicrosoftIdentity.
  2. Add an AzureADB2C object to appsettings.json.

    [!NOTE] When using Azure B2C user flows, you need to set the Instance and the PolicyId of the type of flow.

    :::code language="json" source="azure-ad-b2c/sample/appsettings-b2c-userflow.json" highlight="2-17":::

    • For Domain, use the domain of your Azure AD B2C tenant.
    • For ClientId, use the Application (client) ID from the app registration you created in your tenant.
    • For Instance, use the domain of your Azure AD B2C tenant.
    • For SignUpSignInPolicyId, use the user flow policy defined in the Azure B2C tenant
    • Use either the ClientSecret or the ClientCertificates configuration. ClientCertificates are recommended.
    • Leave all other values as they are.
  3. In Pages/Shared, create a file named _LoginPartial.cshtml. Include the following code:

    :::code language="razor" source="azure-ad-b2c/sample/Pages/Shared/_LoginPartial.cshtml":::

    The preceding code:

    • Checks if the user is authenticated.
    • Renders a Sign out or Sign in link as appropriate.
      • The link points to an action method on the Account controller in the MicrosoftIdentity area.
  4. In Pages/Shared/_Layout.cshtml, add the highlighted line within the <header> element:

    :::code language="razor" source="azure-ad-b2c/sample/Pages/Shared/_Layout.cshtml" range="12-33" highlight="18":::

    Adding <partial name="_LoginPartial" /> renders the _LoginPartial.cshtml partial view in every page request that uses this layout.

  5. In Program.cs, make the following changes:

    1. Add the following using directives:

      :::code language="csharp" source="azure-ad-b2c/sample/Program.cs" id="snippet_NewUsings":::

      The preceding code resolves references used in the next steps.

    2. Update the builder.Services lines with the following code:

      :::code language="csharp" source="azure-ad-b2c/sample/Program.cs" id="snippet_builderservices":::

      In the preceding code:

      • Calls to the AddAuthentication and AddMicrosoftIdentityWebApp methods configure the app to use Open ID Connect, specifically configured for the Microsoft identity platform.
      • AddAuthorization initializes ASP.NET Core authorization.
      • The AddRazorPages call configures the app so anonymous browsers can view the Index page. All other requests require authentication.
      • AddMvcOptions and AddMicrosoftIdentityUI add the required UI components for redirecting to/from Azure AD B2C.
    3. Update the highlighted line to the Configure method:

      :::code language="csharp" source="azure-ad-b2c/sample/Program.cs" id="snippet_app":::

      The preceding code enables authentication in ASP.NET Core.

Run the app

[!NOTE] Use the profile which matches the Azure App registration Redirect URIs

  1. Run the app.

    dotnet run --launch-profile https
    
  2. Browse to the app's secure endpoint, for example, https://localhost:5001/.

    • The Index page renders with no authentication challenge.
    • The header includes a Sign in link because you're not authenticated.
  3. Select the Privacy link.

    • The browser is redirected to your tenant's configured authentication method.
    • After signing in, the header displays a welcome message and a Sign out link.

Next steps

In this tutorial, you learned how to configure an ASP.NET Core app for authentication with Azure AD B2C.

Now that the ASP.NET Core app is configured to use Azure AD B2C for authentication, the Authorize attribute can be used to secure your app. Continue developing your app by learning to: