Povolení ověřování ve vlastní webové aplikaci pomocí Azure AD B2C

Důležité

Od 1. května 2025 už nebude Azure AD B2C k dispozici k nákupu pro nové zákazníky. Další informace najdete v našich nejčastějších dotazech.

Tento článek popisuje, jak přidat ověřování Azure Active Directory B2C (Azure AD B2C) do vlastní webové aplikace ASP.NET. Zjistěte, jak vytvořit webovou aplikaci ASP.NET Core pomocí middlewaru ASP.NET Core, který používá protokol OpenID Connect .

Tento článek použijte ve spojení s konfigurací ověřování v ukázkové webové aplikaci a nahraďte ukázkovou webovou aplikaci vlastní webovou aplikací.

Požadavky

Pokud chcete zkontrolovat požadavky a pokyny k integraci, přečtěte si téma Konfigurace ověřování v ukázkové webové aplikaci.

Krok 1: Vytvoření projektu webové aplikace

Můžete použít existující projekt webové aplikace ASP.NET model-view-controller (MVC) nebo vytvořit nový. Pokud chcete vytvořit nový projekt, otevřete příkazové prostředí a zadejte následující příkaz:

dotnet new mvc -o mywebapp

Předchozí příkaz provede následující:

Vytvoří novou webovou aplikaci MVC.
Parametr -o mywebapp vytvoří adresář mywebapp se zdrojovými soubory aplikace.

Krok 2: Přidání knihoven ověřování

Přidejte webovou knihovnu Microsoft Identity, což je sada knihoven ASP.NET Core, které zjednodušují přidávání ověřování a autorizace Azure AD B2C do webové aplikace. Webová knihovna Microsoft Identity nastaví ověřovací kanál s ověřováním na základě souborů cookie. Stará se o odesílání a přijímání ověřovacích zpráv HTTP, ověřování tokenů, extrakce deklarací identity a další.

Pokud chcete přidat webovou knihovnu Microsoft Identity, nainstalujte balíčky spuštěním následujících příkazů:

Visual Studio
Visual Studio Code

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

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

Krok 3: Zahájení knihoven ověřování

Webový middleware Microsoft Identity používá spouštěcí třídu, která se spouští při spuštění procesu hostování. V tomto kroku přidáte potřebný kód pro zahájení knihoven ověřování.

Otevřete Startup.cs a na začátku třídy přidejte následující using deklarace:

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

Vzhledem k tomu, že web Microsoft Identity Web používá ověřování na základě souborů cookie k ochraně webové aplikace, nastaví následující kód nastavení souboru cookie SameSite . Pak přečte AzureAdB2C nastavení aplikace a zahájí middlewarový kontroler s jeho zobrazením.

ConfigureServices(IServiceCollection services) Funkci nahraďte následujícím fragmentem kódu:

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"));
}

Následující kód přidá zásady souborů cookie a použije ověřovací model. Configure Funkci nahraďte následujícím fragmentem kódu:

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();
    });
};

Krok 4: Přidání prvků uživatelského rozhraní

Pokud chcete přidat prvky uživatelského rozhraní, použijte částečné zobrazení, které obsahuje logiku pro kontrolu, jestli jsou uživatelé přihlášení. Pokud uživatelé nejsou přihlášení, částečné zobrazení vykreslí tlačítko pro přihlášení. Pokud jsou přihlášení, zobrazí se zobrazované jméno uživatele a tlačítko odhlášení.

Ve složce /Views/Shared vytvořte nový soubor _LoginPartial.cshtml s následujícím fragmentem kódu:

@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>
}

Upravte soubor /Views/Shared_Layout.cshtml tak, aby zahrnoval soubor _LoginPartial.cshtml , který jste přidali. Soubor _Layout.cshtml je běžné rozložení, které uživatelům poskytuje konzistentní prostředí při přechodu ze stránky na stránku. Rozložení zahrnuje běžné prvky uživatelského rozhraní, jako je záhlaví a zápatí aplikace.

Poznámka:

V závislosti na verzi .NET Core, kterou používáte, a jestli přidáváte přihlášení do existující aplikace, můžou prvky uživatelského rozhraní vypadat jinak. Pokud ano, nezapomeňte zahrnout _LoginPartial do správného umístění v rozložení stránky.

Otevřete soubor /Views/Shared/_Layout.cshtml a přidejte následující div prvek.

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

Nahraďte tento prvek následujícím kódem 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>

Předchozí kód Razor obsahuje odkaz na Claims akci, kterou vytvoříte v dalším kroku.

Krok 5: Přidání zobrazení deklarací identity

Pokud chcete zobrazit deklarace identity tokenu ID, přidejte do složky /Views/Home zobrazení 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>

V tomto kroku přidáte Claims akci, která propojí zobrazení Claims.cshtml s kontrolerem Home . Akce Claims používá Authorize atribut, který omezuje přístup k akci ověřeným uživatelům.

Do kontroleru /Controllers/HomeController.cs přidejte následující akci:

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

Na začátek třídy přidejte následující using deklaraci:

using Microsoft.AspNetCore.Authorization;

Krok 6: Přidání nastavení aplikace

Nastavení zprostředkovatele identity Azure AD B2C se ukládají do souboruappsettings.json . Otevřete appsettings.jsona přidejte následující nastavení:

"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>"
}

Požadované informace jsou popsané v článku konfigurace ověřování v ukázkové webové aplikaci . Použijte následující nastavení:

Instance: Nahraďte <your-tenant-name> první částí vašeho názvu tenanta Azure AD B2C (například https://contoso.b2clogin.com).
Doména: Nahraďte <your-b2c-domain> úplným názvem tenanta Azure AD B2C (například contoso.onmicrosoft.com).
ID klienta: Nahraďte <web-app-application-id> ID aplikace z kroku 2.
Název zásady: Nahraďte <your-sign-up-in-policy> toky uživatelů, které jste vytvořili v kroku 1.

Krok 7: Spuštění aplikace

Sestavte a spusťte projekt.
Přejděte na https://localhost:5001 .
Vyberte Zaregistrovat/in.
Dokončete proces registrace nebo přihlášení.

Po úspěšném ověření se na navigačním panelu zobrazí zobrazované jméno. Pokud chcete zobrazit deklarace identity, které se token Azure AD B2C vrátí do vaší aplikace, vyberte Deklarace identity.

Další kroky

Zjistěte, jak přizpůsobit a vylepšit prostředí ověřování Azure AD B2C pro vaši webovou aplikaci.

Váš názor

Byla tato stránka užitečná?

Last updated on 2025-05-08