Sdílet prostřednictvím

Zabezpečení hostované aplikace ASP.NET Core Blazor WebAssembly pomocí ID Microsoft Entra

  • Článek

Důležité

Šablona projektu Hostovaná Blazor WebAssembly byla z rozhraní odebrána s vydáním rozhraní .NET 8 (listopad 2023). Pokyny v tomto článku jsou podporovány pouze pro .NET 7 nebo starší. Hostované Blazor WebAssembly aplikace, které jsou upgradovány v každé verzi, budou nadále dostávat podporu produktů. Alternativně refaktorujte aplikaci do samostatné aplikace Blazor WebAssembly nebo Blazor Web App.

Tento článek vysvětluje, jak vytvořit hostované Blazor WebAssembly řešení, které k ověřování používá ID Microsoft Entra (ME-ID). Tento článek se zaměřuje na aplikaci pro jeden tenant s registrací v Azure pro jeden tenant.

Tento článek se nezabývá registrací ME-ID s více tenanty. Další informace najdete v tématu Vytvoření víceklientní aplikace.

Tento článek se zaměřuje na použití tenanta Microsoft Entra , jak je popsáno v rychlém startu: Nastavení tenanta. Pokud je aplikace zaregistrovaná v tenantovi Azure Active Directory B2C, jak je popsáno v Kurzu: Vytvoření tenanta Azure Active Directory B2C, ale postupuje podle pokynů v tomto článku, URI ID aplikace se spravuje jinak pomocí ME-ID. Další informace najdete v části tohoto článku Použití Azure Active Directory B2C.

Po přečtení tohoto článku najdete další scénáře zabezpečení v tématu ASP.NET Core Blazor WebAssembly další scénáře zabezpečení.

Průvodce

Pododdíly návodu vysvětlují, jak:

  • Vytvoření tenanta v Azure
  • Registrace serverové aplikace API v Azure
  • Registrace klientské aplikace v Azure
  • Blazor Vytvoření aplikace
  • Server appsettings.json Úprava konfigurace
  • Úprava výchozího schématu oboru přístupového tokenu
  • Spustit aplikaci

Vytvoření tenanta v Azure

Postupujte podle pokynů v rychlém startu: Nastavte tenanta pro vytvoření tenanta v ME-ID.

Registrace serverové aplikace API v Azure

Registrace aplikace ME-ID pro aplikaci API serveru:

  1. V Azure portálu přejděte na Microsoft Entra ID. Na bočním panelu vyberte Aplikace> Registrace aplikací. Vyberte tlačítko Nová registrace.
  2. Zadejte název aplikace (napříkladBlazor Server).
  3. Zvolte podporované typy účtů. Pro tuto zkušenost můžete vybrat pouze účty v tomto organizačním adresáři (jednotný tenant).
  4. Aplikace Rozhraní API serveru v tomto scénáři nevyžaduje identifikátor URI přesměrování, proto ponechte rozevírací seznam Vybrat platformu nezvolený a nezadávejte přesměrovací identifikátor URI.
  5. Tento článek předpokládá, že je aplikace zaregistrovaná v tenantovi Microsoft Entra . Pokud je aplikace zaregistrovaná v klientovi Azure Active Directory B2C, je políčko Oprávnění>k dispozici a vybrané pro udělení souhlasu správce pro oprávnění openid a offline_access. Zrušením zaškrtnutí políčka toto nastavení zakážete. Pokud používáte tenanta Active Azure Directory , zaškrtávací políčko není k dispozici.
  6. Vyberte Zaregistrovat.

Poznamenejte si následující informace:

  • ID aplikace rozhraní API serveru (klient) (například 00001111-aaaa-2222-bbbb-3333cccc4444)
  • ID adresáře (tenanta) (například aaaabbbb-0000-cccc-1111-dddd2222eeee)
  • Primární doména ME-ID/Vydavatel/Tenant (například contoso.onmicrosoft.com): Doména je k dispozici jako doména vydavatele v panelu Branding portálu Azure pro zaregistrovanou aplikaci.

V oprávněních rozhraní API odeberte oprávnění Microsoft Graph>User.Read, protože serverová aplikace API nevyžaduje další přístup k rozhraní API pro pouhé přihlašování uživatelů a volání koncových bodů rozhraní API serveru.

V zveřejnění rozhraní API:

  1. Potvrďte nebo přidejte URI ID aplikace ve formátu api://{SERVER API APP CLIENT ID}.
  2. Vyberte Přidat rozsah.
  3. Vyberte Uložit a pokračovat.
  4. Zadejte název oboru (napříkladAPI.Access).
  5. Zadejte zobrazovaný název souhlasu správce (například Access API).
  6. Zadejte popis souhlasu Allows the app to access server app API endpoints.
  7. Ověřte, že Stav je nastaven na Povoleno.
  8. Vyberte Přidat rozsah.

Poznamenejte si následující informace:

  • IDENTIFIKÁTOR URI ID aplikace (například záznam 00001111-aaaa-2222-bbbb-3333cccc4444 z identifikátoru api://00001111-aaaa-2222-bbbb-3333cccc4444URI ID aplikace)
  • Název oboru (například API.Access)

Důležité

Pokud se pro identifikátor URI ID aplikace používá vlastní hodnota, změny konfigurace jsou nutné jak pro aplikace Server, tak i pro aplikace Client po vytvoření z šablony projektu Blazor WebAssembly. Další informace najdete v části Použití vlastního identifikátoru URI ID aplikace.

Registrace klientské aplikace v Azure

Registrace aplikace ME-ID pro klientskou aplikaci:

  1. V portálu Azure přejděte na Microsoft Entra ID. Na bočním panelu vyberte Registrace aplikací. Vyberte tlačítko Nová registrace.
  2. Zadejte název aplikace (napříkladBlazor).
  3. Zvolte podporované typy účtů. Pro toto prostředí můžete vybrat účty pouze v tomto organizačním adresáři (jednotný tenant).
  4. Nastavte rozevírací seznam URI přesměrování na jednostránková aplikace (SPA) a zadejte následující URI přesměrování: https://localhost/authentication/login-callback. Pokud znáte identifikátor URI přesměrování produkčního prostředí pro výchozího hostitele Azure (například azurewebsites.net) nebo vlastního hostitele domény (například contoso.com), můžete také přidat identifikátor URI přesměrování produkčního prostředí současně s identifikátorem localhost URI přesměrování. Nezapomeňte do všech produkčních přesměrovacích URI, které přidáte, zahrnout číslo portu pro všechny porty kromě :443.
  5. Tento článek předpokládá, že je aplikace zaregistrovaná v tenantovi Microsoft Entra . Pokud je aplikace zaregistrovaná v tenantovi Azure Active Directory B2C, je k dispozici a zaškrtnuto políčko Oprávnění> s možností udělit správci souhlas s oprávněním openid a offline_access. Zrušením zaškrtnutí políčka toto nastavení zakážete. Pokud používáte tenanta Active Azure Directory , zaškrtávací políčko není k dispozici.
  6. Vyberte Zaregistrovat.

Poznámka:

Zadání čísla portu pro localhost přesměrování URI ME-ID není povinné. Další informace najdete v tématu Omezení přesměrování URI (URL pro odpověď): Výjimky pro localhost (dokumentace k Entra).

Client Poznamenejte si ID aplikace (klienta) (například 11112222-bbbb-3333-cccc-4444dddd5555).

V ověřování>Konfigurace platformy>jednostránková aplikace:

  1. Ověřte, že je přítomna přesměrovací URI https://localhost/authentication/login-callback.
  2. V části Implicitní udělení se ujistěte, že nejsou zaškrtnutá políčka pro přístupové tokeny a tokeny ID. Implicitní udělení se nedoporučuje pro Blazor aplikace používající MSAL verze 2.0 nebo novější. Další informace najdete v tématu Zabezpečení ASP.NET Core Blazor WebAssembly.
  3. Zbývající výchozí hodnoty pro aplikaci jsou pro toto prostředí přijatelné.
  4. Pokud jste provedli změny, vyberte tlačítko Uložit.

V oprávněních rozhraní API:

  1. Ověřte, že aplikace má oprávnění Microsoft Graph>User.Read.
  2. Vyberte Přidat oprávnění následované možností Moje rozhraní API.
  3. Ve sloupci Název vyberte aplikaciAPI serveru (například Blazor Server ME-ID). Abyste viděli rozhraní API v oblasti Moje rozhraní API na webu Azure Portal, musíte být vlastníkem registrace aplikace (a registrace aplikace API, pokud se jedná o samostatnou aplikaci). Další informace naleznete v tématu Přiřazení vlastníka aplikace (dokumentace k Microsoft Entra).
  4. Otevřete seznam rozhraní API.
  5. Povolte přístup k rozhraní API (například API.Access).
  6. Vyberte Přidat oprávnění.
  7. Vyberte tlačítko Udělit souhlas správce pro {NÁZEV TENANTA}. Potvrďte výběrem možnosti Ano.

Důležité

Pokud nemáte oprávnění udělit oprávnění správce tenanta v posledním kroku konfigurace oprávnění API, protože je souhlas s používáním aplikace delegován na uživatele, musíte provést následující kroky:

  • Aplikace musí používat důvěryhodnou doménu vydavatele.
  • Server V konfiguraci aplikace na webu Azure Portal vyberte Zveřejnit rozhraní API. V části Autorizované klientské aplikace vyberte tlačítko Přidat klientskou aplikaci. Client Přidejte ID aplikace (klienta) (například 11112222-bbbb-3333-cccc-4444dddd5555).

Blazor Vytvoření aplikace

V prázdné složce nahraďte zástupné symboly v následujícím příkazu informacemi zaznamenanými dříve a spusťte příkaz v příkazovém prostředí:

dotnet new blazorwasm -au SingleOrg --api-client-id "{SERVER API APP CLIENT ID}" --app-id-uri "{SERVER API APP ID URI GUID}" --client-id "{CLIENT APP CLIENT ID}" --default-scope "{DEFAULT SCOPE}" --domain "{TENANT DOMAIN}" -ho -o {PROJECT NAME} --tenant-id "{TENANT ID}"

Upozornění

Nepoužívejte pomlčky (-) v názvu {PROJECT NAME} aplikace, které přeruší tvorbu identifikátoru aplikace OIDC. Logika v Blazor WebAssembly šabloně projektu používá název projektu pro identifikátor aplikace OIDC v konfiguraci řešení. Pascalova konvence (BlazorSample) nebo podtržítka (Blazor_Sample) jsou přijatelné alternativy. Další informace najdete v tématu Pomlčky ve jménu hostovaného Blazor WebAssembly projektu narušují zabezpečení OIDC (dotnet/aspnetcore #35337).

Zástupný symbol Název webu Azure Portal Příklad
{PROJECT NAME} — BlazorSample
{CLIENT APP CLIENT ID} ID aplikace (klienta) aplikace Client 11112222-bbbb-3333-cccc-4444dddd5555
{DEFAULT SCOPE} Název oboru API.Access
{SERVER API APP CLIENT ID} ID aplikace (klienta) pro aplikaci API serveru 00001111-aaaa-2222-bbbb-3333cccc4444
{SERVER API APP ID URI GUID} ID aplikace URI GUID 00001111-aaaa-2222-bbbb-3333cccc4444 (POUZE IDENTIFIKÁTOR GUID, odpovídá hodnotě {SERVER API APP CLIENT ID})
{TENANT DOMAIN} Primární/vydavatel/doména nájemce contoso.onmicrosoft.com
{TENANT ID} ID adresáře (klienta) aaaabbbb-0000-cccc-1111-dddd2222eeee

Výstupní umístění zadané pomocí -o|--output možnosti vytvoří složku projektu, pokud neexistuje, a stane se součástí názvu projektu. Nepoužívejte pomlčky (-) v názvu aplikace, které přeruší vytvoření identifikátoru aplikace OIDC (viz předchozí UPOZORNĚNÍ).

Důležité

Pokud se pro URI ID aplikace používá vlastní hodnota, je po vytvoření aplikací ze šablony projektu Blazor WebAssembly nutné provést změny konfigurace jak pro aplikaci Server, tak i pro aplikaci Client. Další informace najdete v části Použití vlastního URI ID aplikace.

Spustit aplikaci

Spusťte aplikaci z Server projektu. Při používání sady Visual Studio, vyberte jednu z následujících možností:

  • Vyberte rozevírací šipku vedle tlačítka Spustit. V rozevíracím seznamu otevřete Konfigurovat projekty po spuštění. Vyberte možnost Jeden spouštěcí projekt. Potvrďte nebo změňte počáteční projekt na projekt Server.

  • Ověřte, že je projekt Server zvýrazněný v Průzkumníku řešení, než aplikaci spustíte s některým z následujících přístupů:

    • Vyberte tlačítko Run (Spustit).
    • V nabídce použijte Ladění>Spustit ladění.
    • Stiskněte klávesu F5.

  • V příkazovém prostředí přejděte do Server složky projektu řešení. Spusťte příkaz dotnet watch (nebo dotnet run).

Konfigurovat User.Identity.Name

Pokyny v této části se týkají volitelného vyplnění User.Identity.Name hodnotou z name nároku.

Rozhraní API aplikace Server naplní User.Identity.Name hodnotou z typu nároku http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name (například bbbb0000-cccc-1111-dddd-2222eeee3333@contoso.onmicrosoft.com).

Nakonfigurujte aplikaci, aby přijímala hodnotu z deklarace typu name.

Části řešení

Tato část popisuje části řešení vygenerované ze Blazor WebAssembly šablony projektu a popisuje způsob konfigurace řešení Client a Server projektů pro referenci. Pokud jste aplikaci vytvořili pomocí pokynů v části Návod , není v této části potřeba postupovat podle konkrétních pokynů. Pokyny v této části jsou užitečné pro aktualizaci aplikace pro ověřování a autorizaci uživatelů. Alternativním přístupem k aktualizaci aplikace je ale vytvoření nové aplikace z pokynů v části Návod a přesun komponent, tříd a prostředků aplikace do nové aplikace.

Konfigurace appsettings.json

Tato část se týká aplikace řešení Server .

Soubor appsettings.json obsahuje možnosti konfigurace pro obslužnou rutinu JWT použité k ověření přístupových tokenů. Přidejte následující AzureAd část konfigurace:

{
  "AzureAd": {
    "Instance": "https://login.microsoftonline.com/",
    "Domain": "{TENANT DOMAIN}",
    "TenantId": "{TENANT ID}",
    "ClientId": "{SERVER API APP CLIENT ID}",
    "CallbackPath": "/signin-oidc",
    "Scopes": "{SCOPES}"
  }
}

Příklad:

{
  "AzureAd": {
    "Instance": "https://login.microsoftonline.com/",
    "Domain": "contoso.onmicrosoft.com",
    "TenantId": "aaaabbbb-0000-cccc-1111-dddd2222eeee",
    "ClientId": "00001111-aaaa-2222-bbbb-3333cccc4444",
    "CallbackPath": "/signin-oidc",
    "Scopes": "API.Access"
  }
}

Důležité

Server Pokud je aplikace zaregistrovaná k použití vlastního URI identifikátoru aplikace v ME-ID (ne ve výchozím formátu api://{SERVER API APP CLIENT ID}), přečtěte si část Použití vlastního URI identifikátoru aplikace. Jsou vyžadovány změny v aplikacích Server i Client.

Ověřovací balíček

Tato část se týká aplikace řešení Server .

Podpora ověřování a autorizace volání webových rozhraní API ASP.NET Core s platformou Microsoft Identity Platform poskytuje balíček Microsoft.Identity.Web.

Poznámka:

Pokyny k přidávání balíčků do aplikací .NET najdete v článcích v části Instalace a správa balíčků na webu Pracovní postup používání balíčků (dokumentace k NuGetu). Ověřte správné verze balíčků na NuGet.org.

Součástí aplikace Server hostovaného řešení Blazor, vytvořeného podle šablony Blazor WebAssembly, je balíček Microsoft.Identity.Web.UI. Balíček přidá uživatelské rozhraní pro ověřování uživatelů ve webových aplikacích a rozhraní ho Blazor nepoužívá. Server Pokud se aplikace nebude používat k přímému ověřování uživatelů, je bezpečné odebrat odkaz na balíček ze Server souboru projektu aplikace.

Podpora ověřovací služby

Tato část se týká aplikace řešení Server .

Metoda AddAuthentication nastaví ověřovací služby v aplikaci a nakonfiguruje obslužnou rutinu JWT Bearer jako výchozí metodu ověřování. Metoda AddMicrosoftIdentityWebApi konfiguruje služby pro ochranu webového rozhraní API pomocí platformy Microsoft Identity Platform v2.0. Tato metoda očekává AzureAd část v konfiguraci aplikace s potřebnými nastaveními pro inicializaci možností ověřování.

builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
    .AddMicrosoftIdentityWebApi(Configuration.GetSection("AzureAd"));

Poznámka:

Při registraci jednoho schématu ověřování se schéma ověřování automaticky použije jako výchozí schéma aplikace a není nutné schéma uvést do AddAuthentication nebo přes AuthenticationOptions. Další informace najdete v tématu Přehled ASP.NET základního ověřování a oznámení ASP.NET Core (aspnet/Oznámení č. 490).

UseAuthentication a UseAuthorization ujistěte se, že:

  • Aplikace se pokusí analyzovat a ověřovat tokeny při příchozích požadavcích.
  • Všechny žádosti o přístup k chráněnému prostředku bez správných přihlašovacích údajů selžou.
app.UseAuthentication();
app.UseAuthorization();

WeatherForecast řadič

Tato část se týká aplikace řešení Server .

Kontroler WeatherForecast (Controllers/WeatherForecastController.cs) zveřejňuje chráněné rozhraní API s atributem [Authorize] použitým pro kontroler. Je důležité pochopit, že:

  • Atribut [Authorize] v tomto kontroleru rozhraní API je jediná věc, která chrání toto rozhraní API před neoprávněným přístupem.
  • Atribut [Authorize] použitý v Blazor WebAssembly aplikaci slouží jenom jako nápověda k aplikaci, že uživatel by měl mít oprávnění k tomu, aby aplikace fungovala správně.
[Authorize]
[ApiController]
[Route("[controller]")]
[RequiredScope(RequiredScopesConfigurationKey = "AzureAd:Scopes")]
public class WeatherForecastController : ControllerBase
{
    [HttpGet]
    public IEnumerable<WeatherForecast> Get()
    {
        ...
    }
}

Konfigurace wwwroot/appsettings.json

Tato část se týká aplikace řešení Client .

Konfigurace je poskytována souborem wwwroot/appsettings.json :

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/{TENANT ID}",
    "ClientId": "{CLIENT APP CLIENT ID}",
    "ValidateAuthority": true
  }
}

Příklad:

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/e86c78e2-...-918e0565a45e",
    "ClientId": "11112222-bbbb-3333-cccc-4444dddd5555",
    "ValidateAuthority": true
  }
}

Ověřovací balíček

Tato část se týká aplikace řešení Client .

Když je aplikace vytvořená pro použití pracovních nebo školních účtů (SingleOrg), aplikace automaticky obdrží odkaz na balíček pro knihovnu Microsoft Authentication Library (Microsoft.Authentication.WebAssembly.Msal). Balíček poskytuje sadu primitiv, které aplikaci pomáhají ověřovat uživatele a získávat tokeny pro volání chráněných rozhraní API.

Pokud do aplikace přidáváte ověřování, přidejte balíček Microsoft.Authentication.WebAssembly.Msal do aplikace ručně.

Poznámka:

Pokyny k přidávání balíčků do aplikací .NET najdete v článcích v části Instalace a správa balíčků na webu Pracovní postup používání balíčků (dokumentace k NuGetu). Ověřte správné verze balíčků na NuGet.org.

Balíček Microsoft.Authentication.WebAssembly.Msal tranzitivně přidá Microsoft.AspNetCore.Components.WebAssembly.Authentication do aplikace.

Podpora ověřovací služby

Tato část se týká aplikace řešení Client .

Podpora pro instance je přidána tak, aby zahrnovala přístupové tokeny při žádostech do aplikace Server.

V souboru Program:

builder.Services.AddHttpClient("{PROJECT NAME}.ServerAPI", client => 
        client.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress))
    .AddHttpMessageHandler<BaseAddressAuthorizationMessageHandler>();

builder.Services.AddScoped(sp => sp.GetRequiredService<IHttpClientFactory>()
    .CreateClient("{PROJECT NAME}.ServerAPI"));

Zástupný {PROJECT NAME} symbol je název projektu při vytváření řešení. Například zadáním názvu projektu BlazorSample bude vytvořen název HttpClient z BlazorSample.ServerAPI.

Podpora ověřování uživatelů je zaregistrovaná v kontejneru služby pomocí AddMsalAuthentication metody rozšíření poskytované balíčkem Microsoft.Authentication.WebAssembly.Msal . Tato metoda nastaví služby, které aplikace potřebuje k interakci s poskytovatelem Identity (IP).

V souboru Program:

builder.Services.AddMsalAuthentication(options =>
{
    builder.Configuration.Bind("AzureAd", options.ProviderOptions.Authentication);
    options.ProviderOptions.DefaultAccessTokenScopes.Add("{SCOPE URI}");
});

Metoda AddMsalAuthentication přijímá zpětné volání ke konfiguraci parametrů potřebných k ověření aplikace. Hodnoty vyžadované pro konfiguraci aplikace se dají získat z konfigurace ME-ID webu Azure Portal při registraci aplikace.

Obory přístupového tokenu

Tato část se týká aplikace řešení Client .

Výchozí obory přístupového tokenu představují seznam oborů přístupových tokenů, které jsou:

  • Součástí žádosti o přihlášení.
  • Slouží k okamžitému zřízení přístupového tokenu po ověření.

Do souboru Program je možné podle potřeby přidat další obory:

builder.Services.AddMsalAuthentication(options =>
{
    ...
    options.ProviderOptions.DefaultAccessTokenScopes.Add("{SCOPE URI}");
});

Zadejte další obory pomocí AdditionalScopesToConsent:

options.ProviderOptions.AdditionalScopesToConsent.Add("{ADDITIONAL SCOPE URI}");

Poznámka:

AdditionalScopesToConsent Není možné zřídit delegovaná uživatelská oprávnění pro Microsoft Graph prostřednictvím uživatelského rozhraní souhlasu s ID Microsoft Entra, když uživatel poprvé používá aplikaci zaregistrovanou v Microsoft Azure. Další informace najdete v tématu Použití rozhraní Graph API s ASP.NET Core Blazor WebAssembly.

Příklad výchozího oboru přístupového tokenu:

options.ProviderOptions.DefaultAccessTokenScopes.Add(
    "api://00001111-aaaa-2222-bbbb-3333cccc4444/API.Access");

Další informace najdete v následujících částech článku Další scénáře :

Režim přihlášení

Tato část se týká aplikace řešení Client .

Výchozí režim přihlášení v rámci systému je režim pop-up okna, a pokud se okno nepodaří otevřít, přejde do režimu přesměrování. Nakonfigurujte MSAL tak, aby používal režim přesměrování přihlášení nastavením LoginMode vlastnosti MsalProviderOptions na redirect:

builder.Services.AddMsalAuthentication(options =>
{
    ...
    options.ProviderOptions.LoginMode = "redirect";
});

Výchozí nastavení je popup, a hodnota řetězce není citlivá na velká a malá písmena.

Import souboru

Tato část se týká aplikace řešení Client .

Jmenný prostor Microsoft.AspNetCore.Components.Authorization je dostupný prostřednictvím souboru _Imports.razor v celé aplikaci.

@using System.Net.Http
@using System.Net.Http.Json
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.AspNetCore.Components.WebAssembly.Http
@using Microsoft.JSInterop
@using {APPLICATION ASSEMBLY}
@using {APPLICATION ASSEMBLY}.Shared

Indexová stránka

Tato část se týká aplikace řešení Client .

Stránka Index (wwwroot/index.html) obsahuje skript, který definuje v JavaScriptu AuthenticationService . AuthenticationService zpracovává podrobnosti nízké úrovně protokolu OIDC. Aplikace interně volá metody definované ve skriptu k provádění ověřovacích operací.

<script src="_content/Microsoft.Authentication.WebAssembly.Msal/AuthenticationService.js"></script>

Komponenta aplikace

Tato část se týká aplikace řešení Client .

Komponenta App (App.razor) se podobá komponentě App nalezené v Blazor Server aplikacích:

  • Komponenta CascadingAuthenticationState spravuje odhalení AuthenticationState ostatním částem aplikace.
  • Komponenta AuthorizeRouteView se postará o to, že aktuální uživatel má oprávnění pro přístup k dané stránce, nebo v opačném případě vykreslí komponentu RedirectToLogin.
  • Komponenta RedirectToLogin spravuje přesměrování neoprávněných uživatelů na přihlašovací stránku.

Vzhledem ke změnám v rozhraní v jednotlivých verzích ASP.NET Core Razor není markup komponenty App (App.razor) uveden v této části. Pokud chcete zkontrolovat kód komponenty pro danou verzi, použijte některý z následujících přístupů:

  • Vytvořte aplikaci zřízenou pro ověřování z výchozí Blazor WebAssembly šablony projektu pro verzi ASP.NET Core, kterou chcete použít. Zkontrolujte komponentu App (App.razor) ve vygenerované aplikaci.

  • Zkontrolujte komponentu (App) v referenčním App.razor zdroji. Vyberte verzi ze selektoru větve a vyhledejte komponentu ve ProjectTemplates složce úložiště, protože App umístění komponenty se v průběhu let změnilo.

    Poznámka:

    Odkazy na dokumentaci k referenčnímu zdroji .NET obvykle načítají výchozí větev úložiště, která představuje aktuální vývoj pro příští verzi .NET. Pokud chcete vybrat značku pro konkrétní verzi, použijte rozevírací seznam pro přepnutí větví nebo značek. Další informace najdete v tématu Jak vybrat značku verze zdrojového kódu ASP.NET Core (dotnet/AspNetCore.Docs #26205).

Komponenta RedirectToLogin

Tato část se týká aplikace řešení Client .

Komponenta RedirectToLogin (RedirectToLogin.razor):

  • Spravuje přesměrování neoprávněných uživatelů na přihlašovací stránku.
  • Aktuální adresa URL, ke které se uživatel pokouší získat přístup, je udržována tak, aby se v případě úspěšného ověření vrátila na tuto stránku:
    • Stav historie navigace v ASP.NET Core v .NET 7 nebo novějším
    • Řetězec dotazu v ASP.NET Core v .NET 6 nebo starší.

Zkontrolujte komponentu v referenčním RedirectToLogin zdroji. Umístění komponenty se v průběhu času změnilo, proto k vyhledání komponenty použijte vyhledávací nástroje GitHubu.

Poznámka:

Odkazy na dokumentaci k referenčnímu zdroji .NET obvykle načítají výchozí větev úložiště, která představuje aktuální vývoj pro příští verzi .NET. Pokud chcete vybrat značku pro konkrétní verzi, použijte rozevírací seznam pro přepnutí větví nebo značek. Další informace najdete v tématu Jak vybrat značku verze zdrojového kódu ASP.NET Core (dotnet/AspNetCore.Docs #26205).

Komponenta LoginDisplay

Tato část se týká aplikace řešení Client .

Komponenta LoginDisplay (LoginDisplay.razor) je vykreslena v komponentě MainLayout (MainLayout.razor) a spravuje následující chování:

  • Pro ověřené uživatele:
    • Zobrazí aktuální uživatelské jméno.
    • Nabízí odkaz na stránku profilu uživatele v ASP.NET Core Identity.
    • Nabízí tlačítko pro odhlášení z aplikace.
  • Anonymní uživatelé:
    • Nabízí možnost registrace.
    • Nabízí možnost přihlášení.

V této části se nezobrazí kód pro komponentu LoginDisplay z důvodu změn v rozhraní napříč verzemi ASP.NET Core Razor. Pokud chcete zkontrolovat kód komponenty pro danou verzi, použijte některý z následujících přístupů:

  • Vytvořte aplikaci zřízenou pro ověřování z výchozí Blazor WebAssembly šablony projektu pro verzi ASP.NET Core, kterou chcete použít. Zkontrolujte komponentu LoginDisplay ve vygenerované aplikaci.

  • Zkontrolujte komponentu v referenčním LoginDisplay zdroji. Umístění komponenty se v průběhu času změnilo, proto k vyhledání komponenty použijte vyhledávací nástroje GitHubu. Použije se šablonovaný obsah pro Hosted, který se rovná true.

    Poznámka:

    Odkazy na dokumentaci k referenčnímu zdroji .NET obvykle načítají výchozí větev úložiště, která představuje aktuální vývoj pro příští verzi .NET. Pokud chcete vybrat značku pro konkrétní verzi, použijte rozevírací seznam pro přepnutí větví nebo značek. Další informace najdete v tématu Jak vybrat značku verze zdrojového kódu ASP.NET Core (dotnet/AspNetCore.Docs #26205).

Komponenta ověřování

Tato část se týká aplikace řešení Client .

Stránka vytvořená komponentou Authentication (Pages/Authentication.razor) definuje trasy potřebné pro zpracování různých fází ověřování.

Komponenta RemoteAuthenticatorView :

@page "/authentication/{action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication

<RemoteAuthenticatorView Action="@Action" />

@code {
    [Parameter]
    public string? Action { get; set; }
}

Poznámka:

Nulové odkazové typy (NRT) a statická analýza stavu null kompilátorem .NET je podporována v ASP.NET Core v .NET 6 nebo novějším. Před vydáním .NET 6 se typ string v ASP.NET Core zobrazí bez označení typu null (?).

Komponenta FetchData

Tato část se týká aplikace řešení Client .

Komponenta FetchData ukazuje, jak:

  • Zřízení přístupového tokenu
  • K volání rozhraní API chráněného zdroje v aplikaci Server použijte přístupový token.

Direktiva @attribute [Authorize]Blazor WebAssembly označuje autorizační systém, že uživatel musí být autorizovaný, aby mohl tuto komponentu navštívit. Přítomnost atributu Client v aplikaci nezabrání volání rozhraní API na serveru bez správných přihlašovacích údajů. Aplikace Server musí používat [Authorize] na příslušné koncové body, aby je správně chránila.

IAccessTokenProvider.RequestAccessToken postará se o vyžádání přístupového tokenu, který je možné přidat do požadavku pro volání rozhraní API. Pokud je token uložený v mezipaměti nebo služba dokáže zřídit nový přístupový token bez zásahu uživatele, žádost o token proběhne úspěšně. V opačném případě požadavek tokenu selže s chybou AccessTokenNotAvailableException, která je zachycena try-catch v příkazu.

Aby bylo možné získat skutečný token, který se má zahrnout do požadavku, musí aplikace zkontrolovat, že požadavek byl úspěšný voláním tokenResult.TryGetToken(out var token).

Pokud byl požadavek úspěšný, proměnná tokenu se naplní přístupovým tokenem. AccessToken.Value Vlastnost tokenu zviditelňuje literální řetězec, který se má zahrnout do hlavičky požadavku Authorization.

Pokud se token nepodařilo zřídit bez zásahu uživatele, což vede k neúspěšné žádosti:

  • ASP.NET Core v .NET 7 nebo novějším: Aplikace přejde k AccessTokenResult.InteractiveRequestUrl pomocí dané AccessTokenResult.InteractionOptions k aktualizaci přístupového tokenu.
  • ASP.NET Core v .NET 6 nebo starší: Výsledek tokenu obsahuje adresu URL přesměrování. Přechod na tuto adresu URL přenese uživatele na přihlašovací stránku a po úspěšném ověření se vrátí na aktuální stránku.
@page "/fetchdata"
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@using {APP NAMESPACE}.Shared
@attribute [Authorize]
@inject HttpClient Http

...

@code {
    private WeatherForecast[] forecasts;

    protected override async Task OnInitializedAsync()
    {
        try
        {
            forecasts = await Http.GetFromJsonAsync<WeatherForecast[]>("WeatherForecast");
        }
        catch (AccessTokenNotAvailableException exception)
        {
            exception.Redirect();
        }
    }
}

Použití tenanta Azure Active Directory B2C

Pokud je aplikace zaregistrovaná v tenantovi Azure Active Directory B2C, jak je popsáno v Kurz: Vytvoření tenanta Azure Active Directory B2C, ale postupuje podle pokynů v tomto článku, identifikátor URI ID aplikace se kodifikuje jinak pomocí ME-ID.

Typ existujícího tenanta můžete zkontrolovat tak, že v horní části Přehled organizace ME-ID vyberete odkaz Spravovat tenanty. Zkontrolujte hodnotu sloupce typu tenanta pro organizaci. Tato část se týká aplikací, které dodržují pokyny v tomto článku, ale jsou zaregistrované v tenantovi Azure Active Directory B2C .

Místo identifikátoru URI ID aplikace odpovídajícího formátu api://{SERVER API APP CLIENT ID OR CUSTOM VALUE}má identifikátor URI ID aplikace formát https://{TENANT}.onmicrosoft.com/{SERVER API APP CLIENT ID OR CUSTOM VALUE}. Tento rozdíl má vliv na ClientServer konfiguraci aplikací:

  • Pro serverovou aplikaci API nastavte Audience v souboru nastavení aplikace (appsettings.json) tak, aby odpovídal cílové skupině aplikace (identifikátor URI ID aplikace) poskytované na webu Azure Portal bez koncového lomítka:

    "Audience": "https://{TENANT}.onmicrosoft.com/{SERVER API APP CLIENT ID OR CUSTOM VALUE}"

    Příklad:

    "Audience": "https://contoso.onmicrosoft.com/00001111-aaaa-2222-bbbb-3333cccc4444"

  • Program V souboru Client aplikace nastavte cílovou skupinu oboru (identifikátor URI ID aplikace) tak, aby odpovídala cílové skupině aplikace API serveru:

    options.ProviderOptions.DefaultAccessTokenScopes
    .Add("https://{TENANT}.onmicrosoft.com/{SERVER API APP CLIENT ID OR CUSTOM VALUE}/{DEFAULT SCOPE}");

    V předchozím rozsahu je URI id aplikace/cílová skupina část hodnoty, která neobsahuje koncové lomítko (/) a nezahrnuje název oboru ({DEFAULT SCOPE}).

    Příklad:

    options.ProviderOptions.DefaultAccessTokenScopes
    .Add("https://contoso.onmicrosoft.com/00001111-aaaa-2222-bbbb-3333cccc4444/API.Access");

    V předchozím rozsahu se identifikátor URI ID aplikace nebo cílové skupiny vztahuje na část hodnoty, která neobsahuje koncové lomítko (/) a nezahrnuje název oboru (API.Access).

Použití vlastního URI identifikátoru aplikace

Pokud je identifikátor URI ID aplikace vlastní hodnotou, musíte v aplikaci ručně aktualizovat výchozí identifikátor URI Client oboru přístupového tokenu a přidat cílovou skupinu do Server konfigurace ME-ID aplikace.

Důležité

Následující konfigurace se nevyžaduje při použití výchozího identifikátoru api://{SERVER API APP CLIENT ID}URI ID aplikace .

Příklad URI identifikátoru aplikace urn://custom-app-id-uri a název oboru API.Access:

  • V souboru Program aplikace Client:

    options.ProviderOptions.DefaultAccessTokenScopes.Add(
    "urn://custom-app-id-uri/API.Access");

  • appsettings.json V Server aplikaci přidejte Audience položku pouze s identifikátorem URI ID aplikace a bez koncového lomítka:

    "Audience": "urn://custom-app-id-uri"

Odstraňování potíží

Protokolování

Pokud chcete povolit protokolování ladění nebo trasování pro Blazor WebAssembly ověřování, přečtěte si část Protokolování ověřování na straně klienta v dokumentaci ASP.NET Core Blazor protokolování, kde je selektor verze článku nastaven na ASP.NET Core 7.0 nebo novější.

Běžné chyby

  • Chybná konfigurace aplikace nebo Identity poskytovatele (IP)

    Nejčastější chyby jsou způsobené nesprávnou konfigurací. Tady je několik příkladů:

    • V závislosti na požadavcích scénáře brání chybějící nebo nesprávná autorita, instance, ID tenanta, doména tenanta, ID klienta nebo přesměrování URI aplikaci v ověřování klientů.
    • Nesprávné obory požadavků brání klientům v přístupu ke koncovým bodům webového rozhraní API serveru.
    • Nesprávná nebo chybějící oprávnění rozhraní API serveru brání klientům v přístupu ke koncovým bodům webového rozhraní API serveru.
    • Spuštění aplikace na jiném portu, než je nakonfigurované v identifikátoru URI přesměrování registrace aplikace IP adresy. Všimněte si, že port není nutný pro Microsoft Entra ID a aplikaci spuštěnou na adrese localhost pro testování vývoje, ale konfigurace portu aplikace a port, na kterém aplikace běží, se musí shodovat pro jiné než localhost adresy.

    V oddílech konfigurace v tomto článku pokynů jsou ukázány příklady správné konfigurace. Pečlivě zkontrolujte každou část článku, ve které hledáte chybnou konfiguraci aplikace a IP adresy.

    Pokud se konfigurace zobrazí správně:

    • Analyzujte protokoly aplikace.

    • Prozkoumejte síťový provoz mezi klientskou aplikací a IP nebo serverovou aplikací pomocí vývojářských nástrojů prohlížeče. Často je přesná chybová zpráva nebo zpráva s povědomím o příčině problému vrácena klientovi ip adresou nebo serverovou aplikací po provedení požadavku. Pokyny k vývojářským nástrojům najdete v následujících článcích.

    • U verzí Blazor , ve kterých se používá webový token JSON (JWT), dekódujte obsah tokenu, který se používá k ověřování klienta nebo přístupu k webovému rozhraní API serveru, v závislosti na tom, kde k problému dochází. Další informace najdete v tématu Kontrola obsahu webového tokenu JSON (JWT).

    Tým dokumentace reaguje na zpětnou vazbu a chyby v článcích (otevřete problém ze sekce zpětné vazby na této stránce), ale nemůže poskytnout podporu produktům. K dispozici je několik veřejných fór podpory, která vám pomůžou s řešením potíží s aplikací. Doporučujeme následující:

    Předchozí fóra nejsou vlastněna ani řízena Společností Microsoft.

    V případě chybových hlášení rozhraní, které nesouvisejí se zabezpečením, jsou necitlivé a nedůvěrné, otevřete problém u produktové jednotky ASP.NET Core. Neotevírejte problém s produktovou jednotkou, dokud důkladně neprošetříte příčinu problému a nemůžete ho vyřešit sami a s pomocí komunity na veřejném fóru podpory. Produktová jednotka nedokáže řešit potíže s jednotlivými aplikacemi, které jsou poškozené kvůli jednoduché chybné konfiguraci nebo případům použití zahrnujícím služby třetích stran. Pokud je sestava citlivá nebo důvěrná ze své podstaty, nebo popisuje potenciální chybu zabezpečení v produktu, kterou mohou kyberútoky zneužít, navštivte Hlášení problémů se zabezpečením a chyb (dotnet/aspnetcore úložiště GitHub).

  • Neautorizovaný klient pro ME-ID

    info: Autorizace Microsoft.AspNetCore.Authorization.DefaultAuthorizationService[2] selhala. Tyto požadavky nebyly splněny: DenyAnonymousAuthorizationRequirement: Vyžaduje ověřeného uživatele.

    Chyba zpětného volání přihlášení z ME-ID:

    • Chyba: unauthorized_client
    • Popis: AADB2C90058: The provided application is not configured to allow public clients.

    Řešení chyby:

    1. Na webu Azure Portal přejděte k manifestu aplikace.
    2. allowPublicClient Nastavte atribut na null nebo true.

Soubory cookie a data webu

Soubory cookie a data webu se můžou uchovávat v aktualizacích aplikací a kolidovat s testováním a odstraňováním potíží. Při provádění změn kódu aplikace, změn uživatelského účtu u poskytovatele nebo změn konfigurace aplikace poskytovatele zrušte následující:

  • Soubory cookie přihlašování uživatelů
  • Soubory cookie aplikace
  • Uložená a uložená data lokality v mezipaměti

Jedním z přístupů k tomu, aby se zabránilo zasahování souborů cookie a dat webu do testování a řešení potíží, je:

  • Konfigurace prohlížeče
    • K testování můžete použít prohlížeč, který můžete nakonfigurovat tak, aby při každém zavření prohlížeče odstranil všechna cookie data a data webu.
    • Ujistěte se, že je prohlížeč zavřený buď ručně, nebo pomocí integrovaného vývojového prostředí (IDE) pro jakékoli změny na aplikaci, testovacím uživateli nebo konfiguraci poskytovatele.
  • Pomocí vlastního příkazu otevřete prohlížeč v režimu InPrivate nebo Incognito v sadě Visual Studio:
    • Otevřete dialogové okno Procházet pomocí tlačítka Spustit ve Visual Studiu.
    • Vyberte tlačítko Přidat.
    • Do pole Program zadejte cestu k prohlížeči. Následující spustitelné cesty jsou typická umístění instalace pro Windows 10. Pokud je váš prohlížeč nainstalovaný v jiném umístění nebo nepoužíváte Windows 10, zadejte cestu ke spustitelnému souboru prohlížeče.
      • Microsoft Edge: C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe
      • Google Chrome: C:\Program Files (x86)\Google\Chrome\Application\chrome.exe
      • Mozilla Firefox: C:\Program Files\Mozilla Firefox\firefox.exe
    • V poli Argumenty zadejte možnost příkazového řádku, kterou prohlížeč používá k otevření v režimu InPrivate nebo Anonymní režim. Některé prohlížeče vyžadují adresu URL aplikace.
      • Microsoft Edge: Použijte -inprivate.
      • Google Chrome: Použijte --incognito --new-window {URL}, kde {URL} je zástupný symbol pro adresu URL k otevření (například https://localhost:5001).
      • Mozilla Firefox: Použijte -private -url {URL}, kde je zástupný znak {URL} webová adresa k otevření (například https://localhost:5001).
    • Do pole Popisný název zadejte název. Například Firefox Auth Testing.
    • Vyberte tlačítko OK.
    • Pokud se chcete vyhnout výběru profilu prohlížeče pro každou iteraci testování pomocí aplikace, nastavte profil jako výchozí tlačítkem Nastavit jako výchozí .
    • Ujistěte se, že prohlížeč zavírá IDE při každé změně aplikace, testovacího uživatele nebo konfigurace poskytovatele.

Upgrady aplikací

Funkční aplikace může selhat okamžitě po upgradu sady .NET Core SDK na vývojovém počítači nebo změně verzí balíčků v aplikaci. V některých případech můžou inkoherentní balíčky přerušit aplikaci při provádění hlavních upgradů. Většinu těchto problémů je možné vyřešit pomocí těchto pokynů:

  1. Vymažte mezipaměti balíčků NuGet místního systému spuštěním dotnet nuget locals all --clear z příkazového prostředí.
  2. Odstraňte složky projektu bin a obj.
  3. Obnovte a znovu sestavte projekt.
  4. Před opětovným nasazením aplikace odstraňte všechny soubory ve složce nasazení na serveru.

Poznámka:

Použití verzí balíčků nekompatibilních s cílovou architekturou aplikace se nepodporuje. Informace o balíčku najdete v galerii NuGet.

Server Spuštění aplikace

Při testování a řešení potíží s hostovaným Blazor WebAssemblyřešením se ujistěte, že aplikaci spouštíte z Server projektu.

Kontrola uživatele

Následující User komponentu lze použít přímo v aplikacích nebo sloužit jako základ pro další přizpůsobení.

User.razor:

@page "/user"
@attribute [Authorize]
@using System.Text.Json
@using System.Security.Claims
@inject IAccessTokenProvider AuthorizationService

<h1>@AuthenticatedUser?.Identity?.Name</h1>

<h2>Claims</h2>

@foreach (var claim in AuthenticatedUser?.Claims ?? Array.Empty<Claim>())
{
    <p class="claim">@(claim.Type): @claim.Value</p>
}

<h2>Access token</h2>

<p id="access-token">@AccessToken?.Value</p>

<h2>Access token claims</h2>

@foreach (var claim in GetAccessTokenClaims())
{
    <p>@(claim.Key): @claim.Value.ToString()</p>
}

@if (AccessToken != null)
{
    <h2>Access token expires</h2>

    <p>Current time: <span id="current-time">@DateTimeOffset.Now</span></p>
    <p id="access-token-expires">@AccessToken.Expires</p>

    <h2>Access token granted scopes (as reported by the API)</h2>

    @foreach (var scope in AccessToken.GrantedScopes)
    {
        <p>Scope: @scope</p>
    }
}

@code {
    [CascadingParameter]
    private Task<AuthenticationState> AuthenticationState { get; set; }

    public ClaimsPrincipal AuthenticatedUser { get; set; }
    public AccessToken AccessToken { get; set; }

    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();
        var state = await AuthenticationState;
        var accessTokenResult = await AuthorizationService.RequestAccessToken();

        if (!accessTokenResult.TryGetToken(out var token))
        {
            throw new InvalidOperationException(
                "Failed to provision the access token.");
        }

        AccessToken = token;

        AuthenticatedUser = state.User;
    }

    protected IDictionary<string, object> GetAccessTokenClaims()
    {
        if (AccessToken == null)
        {
            return new Dictionary<string, object>();
        }

        // header.payload.signature
        var payload = AccessToken.Value.Split(".")[1];
        var base64Payload = payload.Replace('-', '+').Replace('_', '/')
            .PadRight(payload.Length + (4 - payload.Length % 4) % 4, '=');

        return JsonSerializer.Deserialize<IDictionary<string, object>>(
            Convert.FromBase64String(base64Payload));
    }
}

Kontrola obsahu webového tokenu JSON (JWT)

K dekódování webového tokenu JSON (JWT) použijte nástroj microsoftu jwt.ms . Hodnoty v uživatelském rozhraní nikdy neopustí prohlížeč.

Příklad kódovaného JWT (zkrácený pro zobrazení):

eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImtpZCI6Ilg1ZVhrNHh5b2pORnVtMWtsMll0djhkbE5QNC1j ... bQdHBHGcQQRbW7Wmo6SWYG4V_bU55Ug_PW4pLPr20tTS8Ct7_uwy9DWrzCMzpD-EiwT5IjXwlGX3IXVjHIlX50IVIydBoPQtadvT7saKo1G5Jmutgq41o-dmz6-yBMKV2_nXA25Q

Příklad dekódování JWT nástrojem pro aplikaci, která se ověřuje v Azure AAD B2C:

{
  "typ": "JWT",
  "alg": "RS256",
  "kid": "X5eXk4xyojNFum1kl2Ytv8dlNP4-c57dO6QGTVBwaNk"
}.{
  "exp": 1610059429,
  "nbf": 1610055829,
  "ver": "1.0",
  "iss": "https://mysiteb2c.b2clogin.com/11112222-bbbb-3333-cccc-4444dddd5555/v2.0/",
  "sub": "aaaaaaaa-0000-1111-2222-bbbbbbbbbbbb",
  "aud": "00001111-aaaa-2222-bbbb-3333cccc4444",
  "nonce": "bbbb0000-cccc-1111-dddd-2222eeee3333",
  "iat": 1610055829,
  "auth_time": 1610055822,
  "idp": "idp.com",
  "tfp": "B2C_1_signupsignin"
}.[Signature]

Další materiály