Включение проверки подлинности в собственном веб-приложении с помощью Azure AD B2C

Это важно

Начиная с 1 мая 2025 г. Azure AD B2C больше не будет доступен для приобретения для новых клиентов. Дополнительные сведения см. в разделе "Вопросы и ответы".

В этой статье показано, как добавить проверку подлинности Azure Active Directory B2C (Azure AD B2C) в собственное веб-приложение ASP.NET. Узнайте, как создать веб-приложение ASP.NET Core с помощью по промежуточного слоя ASP.NET Core, использующего протокол OpenID Connect .

Используйте эту статью в сочетании с настройкой проверки подлинности в примере веб-приложения, заменив пример веб-приложения собственным веб-приложением.

Предпосылки

Сведения о предварительных требованиях и инструкциях по интеграции см. в разделе "Настройка проверки подлинности" в примере веб-приложения.

Шаг 1. Создание проекта веб-приложения

Вы можете использовать существующий проект веб-приложения ASP.NET model-view-controller (MVC) или создать новый. Чтобы создать проект, откройте командную оболочку и введите следующую команду:

dotnet new mvc -o mywebapp

Предыдущая команда выполняет следующие действия:

• Он создает новое веб-приложение MVC.
• Параметр -o mywebapp создает каталог mywebapp с исходными файлами для приложения.

Шаг 2. Добавление библиотек проверки подлинности

Добавьте библиотеку Microsoft Identity Web, которая представляет собой набор библиотек ASP.NET Core, упрощающих добавление проверки подлинности и авторизации Azure AD B2C в веб-приложение. Веб-библиотека удостоверений Майкрософт настраивает конвейер проверки подлинности на основе файлов cookie. Он заботится о отправке и получении сообщений проверки подлинности HTTP, проверки маркеров, извлечения утверждений и т. д.

Чтобы добавить веб-библиотеку Microsoft Identity Web, установите пакеты, выполнив следующие команды:

Visual Studio

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

Visual Studio Code

Install-Package Microsoft.Identity.Web
Install-Package Microsoft.Identity.Web.UI 

Шаг 3. Запуск библиотек проверки подлинности

ПО промежуточного слоя Microsoft Identity Web использует класс запуска, который запускается при запуске процесса размещения. На этом шаге необходимо добавить необходимый код для запуска библиотек проверки подлинности.

Откройте Startup.cs, затем в начале класса добавьте следующие using объявления:

using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;
using Microsoft.Identity.Web;
using Microsoft.Identity.Web.UI;

Так как Microsoft Identity Web использует проверку подлинности на основе файлов cookie для защиты веб-приложения, следующий код задает параметры cookie SameSite . Затем он считывает AzureAdB2C параметры приложения и инициирует контроллер ПО промежуточного слоя с его представлением.

Замените функцию ConfigureServices(IServiceCollection services) следующим фрагментом кода:

public void ConfigureServices(IServiceCollection services)
{
    services.Configure<CookiePolicyOptions>(options =>
    {
        // This lambda determines whether user consent for non-essential cookies is needed for a given request.
        options.CheckConsentNeeded = context => true;
        options.MinimumSameSitePolicy = SameSiteMode.Unspecified;
        // Handling SameSite cookie according to https://learn.microsoft.com/aspnet/core/security/samesite?view=aspnetcore-3.1
        options.HandleSameSiteCookieCompatibility();
    });

    // Configuration to sign-in users with Azure AD B2C
    services.AddMicrosoftIdentityWebAppAuthentication(Configuration, "AzureAdB2C");

    services.AddControllersWithViews()
        .AddMicrosoftIdentityUI();

    services.AddRazorPages();

    //Configuring appsettings section AzureAdB2C, into IOptions
    services.AddOptions();
    services.Configure<OpenIdConnectOptions>(Configuration.GetSection("AzureAdB2C"));
}

Следующий код добавляет политику cookie и использует модель проверки подлинности. Замените функцию Configure следующим фрагментом кода:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
    else
    {
        app.UseExceptionHandler("/Home/Error");
        // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
        app.UseHsts();
    }

    app.UseHttpsRedirection();
    app.UseStaticFiles();

    // Add the Microsoft Identity Web cookie policy
    app.UseCookiePolicy();
    app.UseRouting();
    // Add the ASP.NET Core authentication service
    app.UseAuthentication();
    app.UseAuthorization();

    app.UseEndpoints(endpoints =>
    {
        endpoints.MapControllerRoute(
            name: "default",
            pattern: "{controller=Home}/{action=Index}/{id?}");
        
        // Add endpoints for Razor pages
        endpoints.MapRazorPages();
    });
};

Шаг 4. Добавление элементов пользовательского интерфейса

Чтобы добавить элементы пользовательского интерфейса, используйте частичное представление, содержащее логику для проверки того, вошли ли пользователи. Если пользователи не вошли в систему, частичное представление отображает кнопку входа. При входе в систему отображается отображаемое имя пользователя и кнопка выхода.

Создайте файл _LoginPartial.cshtml в папке /Views/Shared со следующим фрагментом кода:

@using System.Security.Principal
@if (User.Identity.IsAuthenticated)
{
    <ul class="nav navbar-nav navbar-right">
        <li class="navbar-text">Hello @User.Identity.Name</li>
        <!-- The Account controller is not defined in this project. Instead, it is part of Microsoft.Identity.Web.UI nuget package and
            it defines some well known actions such as SignUp/In, SignOut and EditProfile-->
        <li class="navbar-btn">
            <form method="get" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="EditProfile">
                <button type="submit" class="btn btn-primary" style="margin-right:5px">Edit Profile</button>
            </form>
        </li>
        <li class="navbar-btn">
            <form method="get" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignOut">
                <button type="submit" class="btn btn-primary">Sign Out</button>
            </form>
        </li>
    </ul>
}
else
{
    <ul class="nav navbar-nav navbar-right">
        <li class="navbar-btn">
            <form method="get" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignIn">
                <button type="submit" class="btn btn-primary">Sign Up/In</button>
            </form>
        </li>
    </ul>
}

Измените файл /Views/Shared_Layout.cshtml , чтобы включить добавленный файл _LoginPartial.cshtml . Файл _Layout.cshtml — это общий макет, предоставляющий пользователям согласованный интерфейс по мере перехода с страницы на страницу. Макет включает общие элементы пользовательского интерфейса, такие как верхний и нижний колонтитул приложения.

Замечание

В зависимости от используемой версии .NET Core и того, добавляете ли вы вход в существующее приложение, элементы пользовательского интерфейса могут выглядеть иначе. В этом случае обязательно включите _LoginPartial в правильное расположение в макете страницы.

Откройте файл /Views/Shared/_Layout.cshtml , а затем добавьте следующий div элемент.

<div class="navbar-collapse collapse">
...
</div>

Замените этот элемент следующим кодом Razor:

<div class="navbar-collapse collapse">
  <ul class="nav navbar-nav">
    <li><a asp-area="" asp-controller="Home" asp-action="Index">Home</a></li>
    <li><a asp-area="" asp-controller="Home" asp-action="Claims">Claims</a></li>
  </ul>
  <partial name="_LoginPartial" />
</div>

Предыдущий код Razor содержит ссылку на Claims действие, которое вы создадите на следующем шаге.

Шаг 5. Добавление представления утверждений

Чтобы просмотреть утверждения маркера идентификатора, в папке /Views/Home добавьте представление Claims.cshtml .

@using System.Security.Claims

@{
  ViewData["Title"] = "Claims";
}
<h2>@ViewData["Title"].</h2>

<table class="table-hover table-condensed table-striped">
  <tr>
    <th>Claim Type</th>
    <th>Claim Value</th>
  </tr>

  @foreach (Claim claim in User.Claims)
  {
    <tr>
      <td>@claim.Type</td>
      <td>@claim.Value</td>
    </tr>
  }
</table>

На этом шаге Claims вы добавите действие, которое связывает представление Claims.cshtml с контроллером Home . Действие Claims использует Authorize атрибут, который ограничивает доступ к действию для прошедших проверку подлинности пользователей.

В контроллере /Controllers/HomeController.cs добавьте следующее действие:

[Authorize]
public IActionResult Claims()
{
    return View();
}

В начале класса добавьте следующее using объявление:

using Microsoft.AspNetCore.Authorization;

Шаг 6. Добавление параметров приложения

Параметры поставщика удостоверений Azure AD B2C хранятся в файлеappsettings.json . Откройте appsettings.json, а затем добавьте следующие параметры:

"AzureAdB2C": {
  "Instance": "https://<your-tenant-name>.b2clogin.com",
  "ClientId": "<web-app-application-id>",
  "Domain": "<your-b2c-domain>",
  "SignedOutCallbackPath": "/signout-oidc",
  "SignUpSignInPolicyId": "<your-sign-up-in-policy>"
}

Необходимые сведения описаны в статье "Настройка проверки подлинности" в примере веб-приложения . Используйте следующие параметры:

• Экземпляр. Замените <your-tenant-name> первой частью имени клиента Azure AD B2C (например, https://contoso.b2clogin.com).
• Домен: замените <your-b2c-domain>полное имя клиента Azure AD B2C (например, contoso.onmicrosoft.com).
• Идентификатор клиента: замените <web-app-application-id> идентификатором приложения на шаге 2.
• Имя политики: замените <your-sign-up-in-policy> потоки пользователей, созданные на шаге 1.

Шаг 7. Запуск приложения

1. Соберите проект и запустите его.
2. Перейти к https://localhost:5001.
3. Нажмите кнопку "Регистрация и вход".
4. Завершите процесс регистрации или входа в систему.

После успешной проверки подлинности вы увидите отображаемое имя на панели навигации. Чтобы просмотреть утверждения, возвращаемые маркером Azure AD B2C, выберите "Утверждения".

Дальнейшие шаги

• Узнайте, как настроить и усовершенствовать процедуру проверки подлинности Azure AD B2C для веб-приложения.