ASP.NET Core Blazor autentisering och auktorisering

Om tvingande av auktoriseringsregler måste garanteras ska du inte implementera auktoriseringskontroller i kod på klientsidan. Skapa en Blazor Web App som bara förlitar sig på rendering på serversidan (SSR) för auktoriseringskontroll och regelhantering.

Om tvingande av auktoriseringsregeln och säkerheten för data och kod måste garanteras ska du inte utveckla en app på klientsidan. Skapa en Blazor Server app.

ASP.NET Core Identity är utformat för att fungera inom ramen för HTTP-begäran och svarskommunikation, vilket vanligtvis inte är den kommunikationsmodell som används av Blazor-appklienten-servern. ASP.NET Core-appar som använder ASP.NET Core Identity för användarhantering bör använda Razor Pages i stället för Razor komponenter för Identity-relaterade användargränssnitt, till exempel användarregistrering, inloggning, utloggning och andra användarhanteringsuppgifter. Att skapa Razor komponenter som direkt hanterar Identity uppgifter är möjligt i flera scenarier men rekommenderas inte eller stöds inte av Microsoft.

ASP.NET Core-abstraktioner, till exempel SignInManager<TUser> och UserManager<TUser>, stöds inte i Razor komponenter. Mer information om hur du använder ASP.NET Core Identity med Blazorfinns i Skapa ASP.NET Core Identity i en app på serversidanBlazor.

Stöd för att skydda mot förfalskning

Mallen Blazor:

• Lägger automatiskt till antiforgery-tjänster när AddRazorComponents anropas i filen Program.
• Lägger till Antiforgery Middleware genom att i UseAntiforgery-filen anropa Program i dess begäranbearbetningspipeline och kräver förfalskningsskydd på slutpunkten för att motverka hoten från cross-site request forgery (CSRF/XSRF). UseAntiforgery anropas efter UseHttpsRedirection. Ett anrop till UseAntiforgery måste göras efter anropen, om de finns, till UseAuthentication och UseAuthorization.

Komponenten AntiforgeryToken renderar en antiförfalskningstoken som ett dolt fält, och den här komponenten läggs automatiskt till i formulärinstanser (EditForm). Mer information finns i översikten över ASP.NET Core-formulärBlazor.

Tjänsten AntiforgeryStateProvider ger åtkomst till en antiforgery-token som är associerad med den aktuella sessionen. Infoga tjänsten och anropa dess GetAntiforgeryToken() metod för att få den nuvarande AntiforgeryRequestToken. Mer information finns i Anropa ett webb-API från en ASP.NET Core-appBlazor.

Blazor lagrar begärandetoken i komponenttillstånd, vilket garanterar att antiforgery-token är tillgängliga för interaktiva komponenter, även om de inte har åtkomst till begäran.

Mer information finns i följande resurser:

• Förhindra XSRF-/CSRF-attacker (Cross-Site Request Forgery) i ASP.NET Core: Den här artikeln är den primära ASP.NET Core-artikeln om ämnet, som gäller för serversidan Blazor Server, serverprojektet för Blazor Web Apps och Blazor integrering med MVC/Razor Pages.
• översikt över ASP.NET Core-formulärBlazor: Avsnittet Stöd för skydd mot förfalskning i artikeln gäller stöd för Blazor formulär mot förfalskning.

Blazor Identity användargränssnitt (enskilda konton)

Blazor stöder generering av ett fullständigt Blazor-baserat Identity användargränssnitt när du väljer autentiseringsalternativet för enskilda konton.

Blazor Web App-mallen genererar Identity-kod för en SQL Server-databas. Kommandoradsversionen använder SQLite och innehåller en SQLite-databas för Identity.

Mallen:

• Har stöd för scenarier med interaktiv återgivning på serversidan (interaktiv SSR) och csr-scenarier (klientsidan) med autentiserade användare.
• Lägger till IdentityRazor komponenter och relaterad logik för rutinmässiga autentiseringsuppgifter, till exempel att logga in och ut användare. Komponenterna Identity har också stöd för avancerade Identity funktioner, till exempel kontobekräftelse och lösenordsåterställning och multifaktorautentisering med hjälp av en app från tredje part. Observera att själva Identity komponenterna inte stöder interaktivitet.
• Lägger till Identity-relaterade paket och beroenden.
• Refererar till paketen Identity i _Imports.razor.
• Skapar en anpassad användarklass Identity (ApplicationUser).
• Skapar och registrerar en EF Core databaskontext (ApplicationDbContext).
• Konfigurerar routning för de inbyggda Identity slutpunkterna.
• Innehåller Identity validering och affärslogik.

Om du vill inspektera Blazor ramverkets Identity komponenter kan du komma åt dem i mapparna PagesShared och Components/Account i mappen i serverprojektet för projektmallenBlazor Web App (dotnet/aspnetcoreGitHub-lagringsplatsen).

När du väljer interaktiva webassembly- eller interaktiva autoåtergivningslägen hanterar servern alla autentiserings- och auktoriseringsbegäranden och Identity-komponenterna återges statiskt på servern i Blazor Web Apphuvudprojekt.

Ramverket tillhandahåller en anpassad AuthenticationStateProvider i både server- och klientprojekten (.Client) som överför användarens autentiseringsstatus till webbläsaren. Serverprojektet anropar AddAuthenticationStateSerialization, medan klientprojektet anropar AddAuthenticationStateDeserialization. Om du autentiserar på servern i stället för klienten kan appen komma åt autentiseringstillståndet under förinläsningen och innan .NET WebAssembly-körningen initieras. De anpassade AuthenticationStateProvider implementeringarna använder tjänsten Persistent Component State (PersistentComponentState) för att serialisera autentiseringstillståndet till HTML-kommentarer och sedan läsa tillbaka det från WebAssembly för att skapa en ny AuthenticationState instans. Mer information finns i avsnittet Hantera autentiseringstillstånd i Blazor Web Apps .

Endast för interaktiva serverlösningar, IdentityRevalidatingAuthenticationStateProvider (Components/Account/IdentityRevalidatingAuthenticationStateProvider.cs) i serverprojektet i projektmallenBlazor Web App (dotnet/aspnetcoreGitHub-lagringsplatsen), är en serversida AuthenticationStateProvider som omvaliderar säkerhetsstämpeln för den anslutna användaren var 30:e minut när en interaktiv krets är ansluten.

När du väljer interaktiva webassembly- eller interaktiva autoåtergivningslägen hanterar servern alla autentiserings- och auktoriseringsbegäranden och Identity-komponenterna återges statiskt på servern i Blazor Web Apphuvudprojekt. Projektmallen innehåller en PersistentAuthenticationStateProvider klass (referenskälla) i .Client projektet för att synkronisera användarens autentiseringstillstånd mellan servern och webbläsaren. Klassen är en anpassad implementering av AuthenticationStateProvider. Providern använder Persistent Component State-tjänsten (PersistentComponentState) för att förberenda autentiseringstillståndet och lagra det på sidan.

I huvudprojektet för en Blazor Web Appnamnges autentiseringstillståndsprovidern antingen IdentityRevalidatingAuthenticationStateProvider i mappen för Components/Account serverprojektet i projektmallenBlazor Web App (dotnet/aspnetcoreGitHub-lagringsplats) (endast serverinteraktivitetslösningar) eller PersistingRevalidatingAuthenticationStateProvider (WebAssembly- eller Auto interactivity-lösningar) i samma mapp.

Blazor Identity beror på DbContext instanser som inte har skapats av en fabrik, vilket är avsiktligt eftersom DbContext det räcker för att projektmallens komponenter ska återges Identity statiskt utan stöd för interaktivitet.

En beskrivning av hur globala interaktiva återgivningslägen tillämpas på icke-komponenterIdentity samtidigt som statisk SSR tillämpas för komponenterna Identity finns i ASP.NET Core-återgivningslägenBlazor.

Mer information om hur du bevarar förinstallerat tillstånd finns i ASP.NET Core Blazor prerendered state persistence.

Hantera autentiseringstillstånd i Blazor Web Apps

Det här avsnittet gäller för Blazor Web Apps som antar:

• Individuella konton
• Återgivning på klientsidan (CSR, WebAssembly-baserad interaktivitet).

En autentiseringstillståndsprovider på klientsidan används endast inom Blazor och är inte integrerad med ASP.NET Core-autentiseringssystemet. Under prerendering respekterar Blazor de metadata som definierats på sidan och använder ASP.NET Core-autentiseringssystemet för att avgöra om användaren autentiseras. När en användare navigerar från en sida till en annan används en autentiseringsprovider på klientsidan. När användaren uppdaterar sidan (fullsidesuppdatering) är autentiseringstillståndsprovidern på klientsidan inte inblandad i autentiseringsbeslutet på servern. Eftersom användarens tillstånd inte bevaras av servern går alla autentiseringstillstånd som underhålls på klientsidan förlorade.

För att åtgärda detta är den bästa metoden att utföra autentisering i ASP.NET Core-autentiseringssystemet. Autentiseringstillståndsprovidern på klientsidan tar bara hand om att återspegla användarens autentiseringstillstånd. Exempel på hur du gör detta med autentiseringstillståndsleverantörer demonstreras i Blazor Web App-projektmallen och beskrivs nedan.

I serverprojektets Program fil anropar du AddAuthenticationStateSerialization, som serialiserar den AuthenticationState som returneras av serversidan AuthenticationStateProvider med tjänsten Persistent Component State (PersistentComponentState):

builder.Services.AddRazorComponents()
    .AddInteractiveWebAssemblyComponents()
    .AddAuthenticationStateSerialization();

API:et serialiserar endast serversidans namn och rollanspråk för åtkomst i webbläsaren. Om du vill inkludera alla anspråk anger du SerializeAllClaims till true i anropet på serversidan till AddAuthenticationStateSerialization:

builder.Services.AddRazorComponents()
    .AddInteractiveWebAssemblyComponents()
    .AddAuthenticationStateSerialization(
        options => options.SerializeAllClaims = true);

I filen för klientprojektet (.ClientProgram) anropar du AddAuthenticationStateDeserialization, vilket lägger till en AuthenticationStateProvider där AuthenticationState deserialiseras från servern med AuthenticationStateData och tjänsten Persistent Component State (). Det bör finnas ett motsvarande anrop till AddAuthenticationStateSerialization i serverprojektet.

builder.Services.AddAuthorizationCore();
builder.Services.AddCascadingAuthenticationState();
builder.Services.AddAuthenticationStateDeserialization();

• PersistingRevalidatingAuthenticationStateProvider (dotnet/aspnetcore GitHub-lagringsplats): För Blazor Web Apps som använder interaktiv återgivning på serversidan (interaktiv SSR) och återgivning på klientsidan (CSR). Det här är en AuthenticationStateProvider på serversidan som omvaliderar säkerhetsstämpeln för den anslutna användaren var 30:e minut när en interaktiv session är ansluten. Den använder också tjänsten Persistent Component State för att överföra autentiseringstillståndet till klienten, vilket sedan säkerställs under CSR:s livslängd.

• PersistingServerAuthenticationStateProvider (dotnet/aspnetcore GitHub-lagringsplats): För Blazor Web Apps som endast använder CSR. Det här är en server-sida AuthenticationStateProvider som använder tjänsten Persistent Component State för att överföra autentiseringstillståndet till klienten, som sedan är fast under livstiden för CSR.

• PersistentAuthenticationStateProvider (dotnet/aspnetcore GitHub-lagringsplats): För Blazor Web Apps som antar CSR. Det här är en AuthenticationStateProvider på klientsidan som avgör användarens autentiseringstillstånd genom att söka efter data som sparats på sidan när de renderades på servern. Det här autentiseringstillståndet är fastställt för hela CSR:s livslängd. Om användaren behöver logga in eller ut krävs en fullsidesinläsning. Detta ger endast ett användarnamn och e-postmeddelande i visningssyfte. Det innehåller inte token som autentiserar till servern när efterföljande begäranden görs; processen hanteras separat med hjälp av en cookie som ingår i HttpClient-begäranden till servern.

Ställning Identity

Mer information om hur du integrerar Identity i en app på serversidan Blazor finns i dokumentet Scaffolding Identity för ASP.NET Core-projekt.

Scaffold Identity till en Blazor-applikation för serversidan.

• Utan befintlig auktorisering.
• Med auktorisering.

I filen Program:

builder.Services.AddScoped<ExampleService>();

I Startup.ConfigureServices av Startup.cs:

services.AddScoped<ExampleService>();

@page "/inject-auth-state-provider"
@inherits OwningComponentBase
@inject AuthenticationStateProvider AuthenticationStateProvider

<h1>Inject <code>AuthenticationStateProvider</code> Example</h1>

<p>@message</p>

@code {
    private string? message;
    private ExampleService? ExampleService { get; set; }

    protected override async Task OnInitializedAsync()
    {
        ExampleService = ScopedServices.GetRequiredService<ExampleService>();

        message = await ExampleService.ExampleMethod(AuthenticationStateProvider);
    }
}

@page "/inject-auth-state-provider"
@inject AuthenticationStateProvider AuthenticationStateProvider
@inherits OwningComponentBase

<h1>Inject <code>AuthenticationStateProvider</code> Example</h1>

<p>@message</p>

@code {
    private string? message;
    private ExampleService? ExampleService { get; set; }

    protected override async Task OnInitializedAsync()
    {
        ExampleService = ScopedServices.GetRequiredService<ExampleService>();

        message = await ExampleService.ExampleMethod(AuthenticationStateProvider);
    }
}

• Inaktivera prerendering: Ange återgivningsläget med parametern prerender inställd på false på den högsta komponenten i appens komponenthierarki som inte är en rotkomponent.

  Note

  Det går inte att göra en rotkomponent interaktiv, till exempel komponenten App. Därför kan prerendering inte inaktiveras direkt av komponenten App.

  För appar som baseras på Blazor Web App-projektmallen inaktiveras prerendering vanligtvis där komponenten Routes används i komponenten App (Components/App.razor) :

  <Routes @rendermode="new InteractiveServerRenderMode(prerender: false)" />
  

  Inaktivera även prerendering för den HeadOutlet komponenten:

  <HeadOutlet @rendermode="new InteractiveServerRenderMode(prerender: false)" />
  

  Du kan också selektivt styra återgivningsläget som tillämpas på den Routes komponentinstansen. Se till exempel ASP.NET Core-återgivningslägenBlazor.

• Inaktivera förrendering: Öppna _Host.cshtml filen och ändra render-mode attributet för komponenttagghjälpen till Server:

  <component type="typeof(App)" render-mode="Server" />
  

Giltighetsperiod för tillfällig omdirigerings-URL

Det här avsnittet gäller för Blazor Web Apps.

Använd alternativet RazorComponentsServiceOptions.TemporaryRedirectionUrlValidityDuration för att hämta eller ange giltighetstiden för ASP.NET Core Data Protection för tillfälliga omdirigerings-URL:er som genereras av server-side rendering Blazor. Dessa används endast tillfälligt, så livslängden behöver bara vara tillräckligt lång för att en klient ska kunna ta emot URL:en och börja navigera till den. Det bör dock också vara tillräckligt länge för att tillåta klocksnedvridning mellan servrar. Standardvärdet är fem minuter.

I följande exempel utökas värdet till sju minuter:

builder.Services.AddRazorComponents(options => 
    options.TemporaryRedirectionUrlValidityDuration = 
        TimeSpan.FromMinutes(7));

Skydda data i Blazor Web Appmed interaktiv automatisk rendering

När en Blazor Web App implementerar återgivning på serversidan (SSR) och återgivning på klientsidan (CSR) för komponenter eller en hel app som anger läget interaktiv automatisk återgivning tillämpas behörighet att komma åt komponenter och data på två platser. Komponenten begränsar åtkomsten till sig själv (och alla data som den hämtar) när den återges på servern på grund av ett auktoriseringsattribut i komponentens definitionsfil (@attribute [Authorize]). När komponenten återges på klienten begränsas åtkomsten till data via serverwebb-API-slutpunkterna som anropas från klienten. Du måste vara försiktig när du skyddar dataåtkomsten på båda platserna för att förhindra felaktig dataåtkomst.

Tänk dig följande scenario där säkra väderdata visas av en komponent. Demonstrationer av några av följande metoder kan utvärderas och testas med hjälp av exemplen BlazorWebAppEntra/BlazorWebAppEntraBff(.NET 9 eller senare) eller exemplenBlazorWebAppOidc/BlazorWebAppOidcBff(.NET 8 eller senare) på Blazor GitHub-lagringsplatsen för exempel () (dotnet/blazor-sampleshur du laddar ned).

Klientprojektet har en WeatherForecast-klass för att lagra väderdata:

public sealed class WeatherForecast(DateOnly date, int temperatureC, string summary)
{
    public DateOnly Date { get; set; } = date;
    public int TemperatureC { get; set; } = temperatureC;
    public string? Summary { get; set; } = summary;
    public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
}

Klientprojektets IWeatherForecaster-gränssnitt definierar en GetWeatherForecastAsync metod för att hämta väderdata:

public interface IWeatherForecaster
{
    Task<IEnumerable<WeatherForecast>> GetWeatherForecastAsync();
}

Klientprojektets ClientWeatherForecaster-tjänst implementerar IWeatherForecaster. Metoden GetWeatherForecastAsync anropar ett webb-API i serverprojektet vid /weather-forecast slutpunkten för väderdata:

internal sealed class ClientWeatherForecaster(HttpClient httpClient) 
    : IWeatherForecaster
{
    public async Task<IEnumerable<WeatherForecast>> GetWeatherForecastAsync() =>
        await httpClient.GetFromJsonAsync<WeatherForecast[]>("/weather-forecast") ??
            throw new IOException("No weather forecast!");
}

Klientprojektet har en Weather komponent som:

• Framtvingar auktorisering med ett [Authorize] attribut.
• Använder tjänsten Persistent Component State (PersistentComponentState) för att bevara väderprognosdata när komponenten övergår från statisk till interaktiv SSR på servern. Mer information finns i ASP.NET Core Blazor prerendered state persistence.

@page "/weather"
@using Microsoft.AspNetCore.Authorization
@using BlazorWebAppEntra.Client.Weather
@attribute [Authorize]
@inject IWeatherForecaster WeatherForecaster

<PageTitle>Weather</PageTitle>

<h1>Weather</h1>

<p>This component demonstrates showing data.</p>

@if (Forecasts == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>Date</th>
                <th aria-label="Temperature in Celsius">Temp. (C)</th>
                <th aria-label="Temperature in Fahrenheit">Temp. (F)</th>
                <th>Summary</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var forecast in Forecasts)
            {
                <tr>
                    <td>@forecast.Date.ToShortDateString()</td>
                    <td>@forecast.TemperatureC</td>
                    <td>@forecast.TemperatureF</td>
                    <td>@forecast.Summary</td>
                </tr>
            }
        </tbody>
    </table>
}

@code {
    [PersistentState]
    public IEnumerable<WeatherForecast>? Forecasts { get; set; }

    protected override async Task OnInitializedAsync()
    {
        Forecasts ??= await WeatherForecaster.GetWeatherForecastAsync();
    }
}

@page "/weather"
@using Microsoft.AspNetCore.Authorization
@using BlazorWebAppEntra.Client.Weather
@attribute [Authorize]
@implements IDisposable
@inject PersistentComponentState ApplicationState
@inject IWeatherForecaster WeatherForecaster

<PageTitle>Weather</PageTitle>

<h1>Weather</h1>

<p>This component demonstrates showing data.</p>

@if (forecasts == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>Date</th>
                <th aria-label="Temperature in Celsius">Temp. (C)</th>
                <th aria-label="Temperature in Fahrenheit">Temp. (F)</th>
                <th>Summary</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var forecast in forecasts)
            {
                <tr>
                    <td>@forecast.Date.ToShortDateString()</td>
                    <td>@forecast.TemperatureC</td>
                    <td>@forecast.TemperatureF</td>
                    <td>@forecast.Summary</td>
                </tr>
            }
        </tbody>
    </table>
}

@code {
    private IEnumerable<WeatherForecast>? forecasts;
    private PersistingComponentStateSubscription persistingSubscription;

    protected override async Task OnInitializedAsync()
    {
        if (!ApplicationState.TryTakeFromJson<IEnumerable<WeatherForecast>>(
            nameof(forecasts), out var restoredData))
        {
            forecasts = await WeatherForecaster.GetWeatherForecastAsync();
        }
        else
        {
            forecasts = restoredData!;
        }

        // Call at the end to avoid a potential race condition at app shutdown
        persistingSubscription = ApplicationState.RegisterOnPersisting(PersistData);
    }

    private Task PersistData()
    {
        ApplicationState.PersistAsJson(nameof(forecasts), forecasts);

        return Task.CompletedTask;
    }

    void IDisposable.Dispose() => persistingSubscription.Dispose();
}

Serverprojektet implementerar IWeatherForecaster som ServerWeatherForecaster, vilket genererar och returnerar väderdata genom GetWeatherForecastAsync-metoden.

internal sealed class ServerWeatherForecaster() : IWeatherForecaster
{
    public readonly string[] summaries =
    [
        "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", 
        "Sweltering", "Scorching"
    ];

    public async Task<IEnumerable<WeatherForecast>> GetWeatherForecastAsync()
    {
        // Simulate asynchronous loading to demonstrate streaming rendering
        await Task.Delay(500);

        return Enumerable.Range(1, 5).Select(index =>
            new WeatherForecast
            (
                DateOnly.FromDateTime(DateTime.Now.AddDays(index)),
                Random.Shared.Next(-20, 55),
                summaries[Random.Shared.Next(summaries.Length)]
            ))
        .ToArray();
    }
}

Om appen måste anropa ett externt webb-API för att hämta väderdata kan du mata in en HTTP-klient (HttpClient) för att begära data:

internal sealed class ServerWeatherForecaster(HttpClient httpClient, 
    IHttpContextAccessor httpContextAccessor) : IWeatherForecaster
{
    public async Task<IEnumerable<WeatherForecast>> GetWeatherForecastAsync()
    {
        var httpContext = httpContextAccessor.HttpContext ??
            throw new InvalidOperationException("No HttpContext!");
        var accessToken = await httpContext.GetTokenAsync("access_token") ??
            throw new InvalidOperationException("No access_token was saved");
        using var request = 
            new HttpRequestMessage(HttpMethod.Get, "/weather-forecast");
        request.Headers.Authorization = new("Bearer", accessToken);
        using var response = await httpClient.SendAsync(request);
        response.EnsureSuccessStatusCode();

        return await response.Content.ReadFromJsonAsync<WeatherForecast[]>() ??
            throw new IOException("No weather forecast!");
    }
}

I ytterligare ett tillvägagångssätt kan du injicera en HTTP-klientfabrik (IHttpClientFactory) i ServerWeatherForecaster och anropa ett externt webb-API med en namngiven HTTP-klient som använder en tokenhanterare. Mer information finns i Anropa ett webb-API från en ASP.NET Core-appBlazor.

Om appen använder Microsofts identitetsplattform med Microsoft-webbpaket Identity för Microsoft Entra-ID (se Anropa ett webb-API från en ASP.NET Core-appBlazor) visar följande ServerWeatherForecaster hur du gör ett externt webb-API-anrop. Åtkomsttoken kopplas automatiskt till begäran.

internal sealed class ServerWeatherForecaster(IDownstreamApi downstreamApi) : IWeatherForecaster
{
    public async Task<IEnumerable<WeatherForecast>> GetWeatherForecastAsync()
    {
        using var response = await downstreamApi.CallApiForUserAsync("DownstreamApi",
            options =>
            {
                options.RelativePath = "/weather-forecast";
            });

        return await response.Content.ReadFromJsonAsync<WeatherForecast[]>() ??
            throw new IOException("No weather forecast!");
    }
}

Oavsett vilken metod som används ServerWeatherForecaster för att hämta data, underhåller serverprojektet en säker webb-API-slutpunkt för klientväderdataanrop. Den här slutpunkten resulterar i ett ServerWeatherForecaster.GetWeatherForecastAsync anrop på servern:

app.MapGet("/weather-forecast", (
    [FromServices] IWeatherForecaster WeatherForecaster) =>
{
    return WeatherForecaster.GetWeatherForecastAsync();
}).RequireAuthorization();

Med hjälp av föregående metod finns det två system för att tillhandahålla säkra väderdata till användaren:

• När komponenten Weather återges på servernServerWeatherForecaster används tjänstens GetWeatherForecastAsync metod direkt för att hämta väderdata. Säkerheten för data framtvingas av komponentens [Authorize] attribut. Sammanfattningsvis framtvingas säkerheten för väderdata av komponenten.
• När komponenten Weather återges på klientenClientWeatherForecaster används tjänsten för att göra ett webb-API-anrop till den säkra /weather-forecast slutpunkt som tillämpar tilläggsmetodenRequireAuthorization. Om användaren har behörighet att komma åt väderdata använder slutpunkten tjänsten ServerWeatherForecaster för att anropa GetWeatherForecastAsync. Data returneras till klienten. Sammanfattningsvis framtvingas säkerheten för väderdata av serverappens webb-API-slutpunkt.

Föregående metod fungerar bra när säkerhetskraven för webb-API:et matchar komponentens säkerhetskrav. Till exempel kan samma auktoriseringsprincip tillämpas på både webb-API-slutpunkten och komponenten.

Komplexa scenarier kräver ytterligare planering och implementering. Till exempel kräver ett serverwebb-API som har flera anropare med olika åtkomstbehörigheter antingen en mer avancerad auktoriseringsprincip, en eller flera ytterligare principer eller ytterligare slutpunkter med olika åtkomstkrav.

När du skapar säkerhet i appar som implementerar interaktiv automatisk återgivning bör du tänka på att säkerheten som implementeras för serverns webb-API-slutpunkter inte skyddar serverns tjänstimplementering som används när en komponent renderas på servern och kommer åt data via tjänsten. Väg noggrant skillnaden mellan att komma åt data på servern under SSR jämfört med att komma åt data på en klientwebb-API-begäran under CSR. Tillämpa säkerhet strategiskt för att undvika felaktig åtkomst till data.

Exempel i exempel på Blazor GitHub-lagringsplats () (dotnet/blazor-sampleshur du laddar ned) som visar den metod som beskrivs i det här avsnittet:

• BlazorWebAppOidc
• BlazorWebAppOidcBff
• BlazorWebAppEntra
• BlazorWebAppEntraBff

AuthenticationStateProvider är den underliggande tjänsten som används av AuthorizeView-komponenten och sammanhängande autentiseringstjänster för att hämta autentiseringstillståndet för en användare.

AuthenticationStateProvider är den underliggande tjänsten som används av komponenten AuthorizeView och CascadingAuthenticationState komponent för att hämta autentiseringstillståndet för en användare.

@page "/claims-principal-data"
@using System.Security.Claims
@inject AuthenticationStateProvider AuthenticationStateProvider

<h1>ClaimsPrincipal Data</h1>

<button @onclick="GetClaimsPrincipalData">Get ClaimsPrincipal Data</button>

<p>@authMessage</p>

@if (claims.Any())
{
    <ul>
        @foreach (var claim in claims)
        {
            <li>@claim.Type: @claim.Value</li>
        }
    </ul>
}

<p>@surname</p>

@code {
    private string? authMessage;
    private string? surname;
    private IEnumerable<Claim> claims = Enumerable.Empty<Claim>();

    private async Task GetClaimsPrincipalData()
    {
        var authState = await AuthenticationStateProvider
            .GetAuthenticationStateAsync();
        var user = authState.User;

        if (user.Identity is not null && user.Identity.IsAuthenticated)
        {
            authMessage = $"{user.Identity.Name} is authenticated.";
            claims = user.Claims;
            surname = user.FindFirst(c => c.Type == ClaimTypes.Surname)?.Value;
        }
        else
        {
            authMessage = "The user is NOT authenticated.";
        }
    }
}

I föregående exempel:

• ClaimsPrincipal.Claims returnerar användarens anspråk (claims) för visning i användargränssnittet.
• Raden som hämtar användarens efternamn (surname) anropar ClaimsPrincipal.FindAll med ett predikat för att filtrera användarens anspråk.

@page "/claims-principal-data"
@using System.Security.Claims
@inject AuthenticationStateProvider AuthenticationStateProvider

<h1>ClaimsPrincipal Data</h1>

<button @onclick="GetClaimsPrincipalData">Get ClaimsPrincipal Data</button>

<p>@authMessage</p>

@if (claims.Any())
{
    <ul>
        @foreach (var claim in claims)
        {
            <li>@claim.Type: @claim.Value</li>
        }
    </ul>
}

<p>@surname</p>

@code {
    private string? authMessage;
    private string? surname;
    private IEnumerable<Claim> claims = Enumerable.Empty<Claim>();

    private async Task GetClaimsPrincipalData()
    {
        var authState = await AuthenticationStateProvider
            .GetAuthenticationStateAsync();
        var user = authState.User;

        if (user.Identity is not null && user.Identity.IsAuthenticated)
        {
            authMessage = $"{user.Identity.Name} is authenticated.";
            claims = user.Claims;
            surname = user.FindFirst(c => c.Type == ClaimTypes.Surname)?.Value;
        }
        else
        {
            authMessage = "The user is NOT authenticated.";
        }
    }
}

@page "/cascade-auth-state"

<h1>Cascade Auth State</h1>

<p>@authMessage</p>

@code {
    private string authMessage = "The user is NOT authenticated.";

    [CascadingParameter]
    private Task<AuthenticationState>? authenticationState { get; set; }

    protected override async Task OnInitializedAsync()
    {
        if (authenticationState is not null)
        {
            var authState = await authenticationState;
            var user = authState?.User;

            if (user?.Identity is not null && user.Identity.IsAuthenticated)
            {
                authMessage = $"{user.Identity.Name} is authenticated.";
            }
        }
    }
}

@page "/cascade-auth-state"

<h1>Cascade Auth State</h1>

<p>@authMessage</p>

@code {
    private string authMessage = "The user is NOT authenticated.";

    [CascadingParameter]
    private Task<AuthenticationState>? authenticationState { get; set; }

    protected override async Task OnInitializedAsync()
    {
        if (authenticationState is not null)
        {
            var authState = await authenticationState;
            var user = authState?.User;

            if (user?.Identity is not null && user.Identity.IsAuthenticated)
            {
                authMessage = $"{user.Identity.Name} is authenticated.";
            }
        }
    }
}

Konfigurera Task<AuthenticationState>kaskadparameter med hjälp av AuthorizeRouteView och kaskadautentiseringstillståndstjänster.

När du skapar en Blazor app från någon av de Blazor projektmallarna med autentisering aktiverat, innehåller appen AuthorizeRouteView och anropet till AddCascadingAuthenticationState som visas i följande exempel. En Blazor app på klientsidan innehåller även de tjänstregistreringar som krävs. Ytterligare information visas i avsnittet Anpassa obehörigt innehåll med komponentenRouter.

<Router ...>
    <Found ...>
        <AuthorizeRouteView RouteData="routeData" 
            DefaultLayout="typeof(Layout.MainLayout)" />
        ...
    </Found>
</Router>

I filen Program registrerar du sammanhängande autentiseringstillståndstjänster:

builder.Services.AddCascadingAuthenticationState();

Konfigurera den Task<AuthenticationState>sammanhängande parametern med hjälp av komponenterna AuthorizeRouteView och CascadingAuthenticationState .

När du skapar en Blazor app från en av Blazor projektmallar med autentisering aktiverat innehåller appen de AuthorizeRouteView- och CascadingAuthenticationState komponenter som visas i följande exempel. En Blazor app på klientsidan innehåller även de tjänstregistreringar som krävs. Ytterligare information visas i avsnittet Anpassa obehörigt innehåll med komponentenRouter.

<CascadingAuthenticationState>
    <Router ...>
        <Found ...>
            <AuthorizeRouteView RouteData="routeData" 
                DefaultLayout="typeof(MainLayout)" />
            ...
        </Found>
    </Router>
</CascadingAuthenticationState>

Lägg till auktoriseringstjänster i Blazor-filen i en Program-app på klientsidan:

builder.Services.AddAuthorizationCore();

Lägg till alternativ och auktoriseringstjänster i Blazor-filen i en Program-app på klientsidan:

builder.Services.AddOptions();
builder.Services.AddAuthorizationCore();

Razor-komponenter i Blazor Web Apps visar aldrig <NotAuthorized>-innehåll när auktoriseringen misslyckas på serversidan under statisk SSR. ASP.NET Core-pipelinen bearbetar auktorisering på serversidan. Använd tekniker på serversidan för att hantera obehöriga begäranden. Mer information finns i ASP.NET Core-återgivningslägenBlazor.

Resursauktorisering

Om du vill auktorisera användare för resurser skickar du begärans routningsdata till parametern Resource för AuthorizeRouteView.

I innehållet för Router.Found för en begärd rutt:

<AuthorizeRouteView Resource="routeData" RouteData="routeData" 
    DefaultLayout="typeof(MainLayout)" />

Mer information om hur auktoriseringstillståndsdata skickas och används i procedurlogik finns i avsnittet Exponera autentiseringstillståndet som en sammanhängande parameter .

När AuthorizeRouteView tar emot routningsdata för resursen har auktoriseringsprinciper åtkomst till RouteData.PageType och RouteData.RouteValues som tillåter att anpassad logik fattar auktoriseringsbeslut.

I följande exempel skapas en EditUser princip i AuthorizationOptions för appens konfiguration av auktoriseringstjänsten (AddAuthorizationCore) med följande logik:

• Kontrollera om det finns ett routningsvärde med nyckeln id. Om nyckeln finns lagras vägvärdet i value.
• I en variabel med namnet idlagrar du value som en sträng eller anger ett tomt strängvärde (string.Empty).
• Om id inte är en tom sträng, kontrollera att principen är uppfylld (returnera true) om strängens värde börjar med EMP. Annars ska du slå fast att policyn misslyckas (returnera false).

I filen Program:

• Lägg till namnområden för Microsoft.AspNetCore.Components och System.Linq:

  using Microsoft.AspNetCore.Components;
  using System.Linq;
  

• Lägg till principen:

  options.AddPolicy("EditUser", policy =>
      policy.RequireAssertion(context =>
      {
          if (context.Resource is RouteData rd)
          {
              var routeValue = rd.RouteValues.TryGetValue("id", out var value);
              var id = Convert.ToString(value, 
                  System.Globalization.CultureInfo.InvariantCulture) ?? string.Empty;
  
              if (!string.IsNullOrEmpty(id))
              {
                  return id.StartsWith("EMP", StringComparison.InvariantCulture);
              }
          }
  
          return false;
      })
  );
  

Föregående exempel är en översimplifierad auktoriseringsprincip som bara används för att demonstrera konceptet med ett fungerande exempel. Mer information om hur du skapar och konfigurerar auktoriseringsprinciper finns i Principbaserad auktorisering i ASP.NET Core.

I följande EditUser komponent har resursen på /users/{id}/edit en vägparameter för användarens identifierare ({id}). Komponenten använder föregående EditUser auktoriseringsprincip för att avgöra om vägvärdet för id börjar med EMP. Om id börjar med EMPlyckas principen och åtkomsten till komponenten är auktoriserad. Om id börjar med ett annat värde än EMP eller om id är en tom sträng misslyckas principen och komponenten läses inte in.

EditUser.razor:

@page "/users/{id}/edit"
@using Microsoft.AspNetCore.Authorization
@attribute [Authorize(Policy = "EditUser")]

<h1>Edit User</h1>

<p>The "EditUser" policy is satisfied! <code>Id</code> starts with 'EMP'.</p>

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

@page "/users/{id}/edit"
@using Microsoft.AspNetCore.Authorization
@attribute [Authorize(Policy = "EditUser")]

<h1>Edit User</h1>

<p>The "EditUser" policy is satisfied! <code>Id</code> starts with 'EMP'.</p>

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

<Router ...>
    <Found ...>
        <AuthorizeRouteView ...>
            <NotAuthorized>
                ...
            </NotAuthorized>
            <Authorizing>
                ...
            </Authorizing>
        </AuthorizeRouteView>
    </Found>
</Router>

Innehållet i Authorized och NotAuthorized kan innehålla godtyckliga objekt, till exempel andra interaktiva komponenter.

builder.Services.AddCascadingAuthenticationState();

<CascadingAuthenticationState>
    <Router ...>
        <Found ...>
            <AuthorizeRouteView ...>
                <NotAuthorized>
                    ...
                </NotAuthorized>
                <Authorizing>
                    ...
                </Authorizing>
            </AuthorizeRouteView>
        </Found>
    </Router>
</CascadingAuthenticationState>

Innehållet i NotFound, Authorizedoch NotAuthorized kan innehålla godtyckliga objekt, till exempel andra interaktiva komponenter.

@page "/procedural-logic"
@inject IAuthorizationService AuthorizationService

<h1>Procedural Logic Example</h1>

<button @onclick="@DoSomething">Do something important</button>

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

    private async Task DoSomething()
    {
        if (authenticationState is not null)
        {
            var authState = await authenticationState;
            var user = authState?.User;

            if (user is not null)
            {
                if (user.Identity is not null && user.Identity.IsAuthenticated)
                {
                    // ...
                }

                if (user.IsInRole("Admin"))
                {
                    // ...
                }

                if ((await AuthorizationService.AuthorizeAsync(user, "content-editor"))
                    .Succeeded)
                {
                    // ...
                }
            }
        }
    }
}

@page "/procedural-logic"
@inject IAuthorizationService AuthorizationService

<h1>Procedural Logic Example</h1>

<button @onclick="@DoSomething">Do something important</button>

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

    private async Task DoSomething()
    {
        if (authenticationState is not null)
        {
            var authState = await authenticationState;
            var user = authState?.User;

            if (user is not null)
            {
                if (user.Identity is not null && user.Identity.IsAuthenticated)
                {
                    // ...
                }

                if (user.IsInRole("Admin"))
                {
                    // ...
                }

                if ((await AuthorizationService.AuthorizeAsync(user, "content-editor"))
                    .Succeeded)
                {
                    // ...
                }
            }
        }
    }
}

• Resurser för serversidan och Blazor Web App
  • Snabbstart: Lägga till inloggning med Microsoft i en ASP.NET Core-webbapp
  • Snabbstart: Skydda ett ASP.NET Core-webb-API med Microsofts identitetsplattform
  • Konfigurera ASP.NET Core att fungera med proxyservrar och lastbalanserare: Innehåller vägledning om:
    • Använda vidarebefordrade huvudmellanprogram för att bevara HTTPS-schemainformation över proxyservrar och interna nätverk.
    • Ytterligare scenarier och användningsfall, inklusive manuell schemakonfiguration, begärandesökvägsändringar för korrekt routning av begäranden och vidarebefordran av begärandeschemat för Linux och icke-IIS omvända proxyservrar.
• Dokumentation om Microsoft identity Platform
  • Overview
  • OAuth 2.0- och OpenID Connect-protokoll på Microsofts identitetsplattform
  • Microsofts identitetsplattform och OAuth 2.0-auktoriseringskodflöde
  • ID-token för Microsofts identitetsplattform
  • Åtkomsttoken för Microsoft identity Platform
• ASP.NET Kärnsäkerhetsavsnitt
• Konfigurera Windows-autentisering i ASP.NET Core
• IHttpContextAccessor/HttpContext i ASP.NET Core-appar Blazor
• Skapa en anpassad version av JavaScript-biblioteket Authentication.MSAL
• AwesomeBlazor: Exempellänkar för community för autentisering
• ASP.NET Core-autentisering Blazor Hybrid och auktorisering

• Resurser på serversidan Blazor
  • Snabbstart: Lägga till inloggning med Microsoft i en ASP.NET Core-webbapp
  • Snabbstart: Skydda ett ASP.NET Core-webb-API med Microsofts identitetsplattform
  • Konfigurera ASP.NET Core att fungera med proxyservrar och lastbalanserare: Innehåller vägledning om:
    • Använda vidarebefordrade huvudmellanprogram för att bevara HTTPS-schemainformation över proxyservrar och interna nätverk.
    • Ytterligare scenarier och användningsfall, inklusive manuell schemakonfiguration, begärandesökvägsändringar för korrekt routning av begäranden och vidarebefordran av begärandeschemat för Linux och icke-IIS omvända proxyservrar.
• Dokumentation om Microsoft identity Platform
  • Overview
  • OAuth 2.0- och OpenID Connect-protokoll på Microsofts identitetsplattform
  • Microsofts identitetsplattform och OAuth 2.0-auktoriseringskodflöde
  • ID-token för Microsofts identitetsplattform
  • Åtkomsttoken för Microsoft identity Platform
• ASP.NET Kärnsäkerhetsavsnitt
• IHttpContextAccessor/HttpContext i ASP.NET Core-appar Blazor
• Konfigurera Windows-autentisering i ASP.NET Core
• Skapa en anpassad version av JavaScript-biblioteket Authentication.MSAL
• AwesomeBlazor: Exempellänkar för community för autentisering