ASP.NET Core használata webes API hívásához Blazor

Ez a cikk azt ismerteti, hogyan hívhat meg webes API-t egy Blazor alkalmazásból.

Package

A System.Net.Http.Json csomag bővítménymódszereket biztosít a System.Net.Http.HttpClient-nek és System.Net.Http.HttpContent-nek, amelyek automatikus szerializálást és deszerializálást végeznek a System.Text.Json használatával. A System.Net.Http.Json csomagot a .NET megosztott keretrendszere biztosítja, és nem igényel csomaghivatkozás hozzáadását az alkalmazáshoz.

Tokenkezelő használata webes API-hívásokhoz

Blazor Web AppAz OIDC-hitelesítést használók jogkivonat-kezelő megközelítéssel küldhetnek kimenő kéréseket, hogy biztonságosan hívjanak meg külső webes API-kat. A BlazorWebAppOidc és BlazorWebAppOidcServer mintaalkalmazások, amelyeket a jelen cikk Mintaalkalmazások részében írnak le, ezt a megközelítést használják.

További információ:

• ASP.NET Core kiszolgálóoldali és Blazor Web App további biztonsági forgatókönyvek
• ASP.NET Core biztosítása OpenID Connect (OIDC) használatávalBlazor Web App
  • Nem BFF minta (Interaktív automatikus folyamat)
  • Nem BFF-minta (interaktív kiszolgáló)

Microsoft Identity Platform webes API-hívásokhoz

Blazor Web AppA Microsoft Identity Platformot a Identity készült Microsoft Web-csomagokkal használó eszközök leegyszerűsített webes API-hívásokat kezdeményezhetnek a Microsoft.Identity.Web.DownstreamApi NuGet-csomag által biztosított API-val.

Note

A csomagok .NET-alkalmazásokhoz való hozzáadásáról a Csomagok telepítése és kezelésea csomaghasználati munkafolyamatban (NuGet-dokumentáció) című cikkben talál útmutatást. Ellenőrizze a megfelelő csomagverziókat a NuGet.org.

Az alkalmazásbeállítások fájlban (appsettings.json) adjon meg egy alap URL-címet és hatóköröket. Az alábbi példában a {BASE ADDRESS} helyőrző a webes API alap URL-címe. Egyetlen hatókör van megadva az alkalmazásazonosító URI-jával ({APP ID URI} helyőrzővel) és a hatókör nevével ({SCOPE NAME} helyőrző):

"DownstreamApi": {
  "BaseUrl": "{BASE ADDRESS}",
  "Scopes": [ "{APP ID URI}/{SCOPE NAME}" ]
}

Example:

"DownstreamApi": {
  "BaseUrl": "https://localhost:7277",
  "Scopes": [ "api://11112222-bbbb-3333-cccc-4444dddd5555/Weather.Get" ]
}

Az alkalmazás Program fájljában hívja meg az alábbit:

• EnableTokenAcquisitionToCallDownstreamApi: Engedélyezi a tokenek beszerzését a webes API-k hívására.
• AddDownstreamApi: A Microsoft Identity webcsomagjai api-t biztosítanak egy elnevezett alsóbb rétegbeli webszolgáltatás létrehozásához webes API-hívások indításához. IDownstreamApi a szerveroldali osztályba kerül, amellyel a CallApiForUserAsync hívható meg az időjárási adatok lekérésére egy külső webes API-n keresztül (MinimalApiJwt projekt).
• AddDistributedTokenCaches: Hozzáadja a .NET elosztott token gyorstárakat a szolgáltatásgyűjteményhez.
• AddDistributedMemoryCache: Hozzáad egy alapértelmezett implementációt IDistributedCache , amely gyorsítótárelemeket tárol a memóriában.
• A elosztott token gyorsítótár beállításainak konfigurálása (MsalDistributedTokenCacheAdapterOptions):
  • A hibakeresési célokra történő fejlesztés során letilthatja az L1 gyorsítótárat a következő beállítással DisableL1Cachetrue: . Mindenképpen állítsa vissza false éles környezetre.
  • Állítsa be az L1-gyorsítótár L1CacheOptions.SizeLimit maximális méretét, hogy a gyorsítótár ne futtassa túl a kiszolgáló memóriáját. Az alapértelmezett érték 500 MB.
  • Hibakeresési célokra történő fejlesztés során letilthatja a jogkivonat titkosítását nyugalmi állapotban, ha a Encrypt értéket false-re állítja, ami az alapértelmezett érték. Mindenképpen állítsa vissza true éles környezetre.
  • Állítsa be a token eltávolítását a gyorsítótárból a következővel SlidingExpiration. Az alapértelmezett érték 1 óra.
  • További információért, beleértve az útmutatást az L2-gyorsítótár hibáinak visszahívásával (OnL2CacheFailure) és az aszinkron L2-gyorsítótár-írások (EnableAsyncL2Write) kezelésével kapcsolatban, tekintse meg a MsalDistributedTokenCacheAdapterOptions és a Tokengyorsítótár szerializálása: Elosztott jogkivonat-gyorsítótárak című dokumentumot.

Dönthet úgy, hogy titkosítja a gyorsítótárat, de ezt mindig kötelező megtenni produktionskörnyezetben.

builder.Services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
    .AddMicrosoftIdentityWebApp(builder.Configuration.GetSection("AzureAd"))
    .EnableTokenAcquisitionToCallDownstreamApi()
    .AddDownstreamApi("DownstreamApi", 
        builder.Configuration.GetSection("DownstreamApi"))
    .AddDistributedTokenCaches();

// Requires the 'Microsoft.Extensions.Caching.Memory' NuGet package
builder.Services.AddDistributedMemoryCache();

builder.Services.Configure<MsalDistributedTokenCacheAdapterOptions>(
    options => 
    {
        // The following lines that are commented out reflect
        // default values. We recommend overriding the default
        // value of Encrypt to encrypt tokens at rest.

        //options.DisableL1Cache = false;
        //options.L1CacheOptions.SizeLimit = 500 * 1024 * 1024;
        options.Encrypt = true;
        //options.SlidingExpiration = TimeSpan.FromHours(1);
    });

A memóriabeli elosztott token gyorsítótárak akkor jönnek létre, amikor a AddDistributedTokenCaches függvényt hívjuk, hogy biztosítsák az elosztott token gyorsítótárazás alapvető implementációját.

Az éles környezetbeli webalkalmazásoknak és webes API-knak elosztott token gyorsítótárat kell használniuk (például: Redis, Microsoft SQL Server, Microsoft Azure Cosmos DB).

Note

Egy gépen történő helyi fejlesztéshez és teszteléshez a memóriabeli jogkivonat-gyorsítótárakat használhatja elosztott jogkivonat-gyorsítótárak helyett:

builder.Services.AddInMemoryTokenCaches();

A fejlesztési és tesztelési időszak későbbi szakaszában válasszon egy gyártási elosztott jogkivonat-gyorsítótár szolgáltatót.

AddDistributedMemoryCache Hozzáad egy alapértelmezett implementációt IDistributedCache , amely gyorsítótárelemeket tárol a memóriában, amelyet a Microsoft Identity Web használ a tokenek gyorsítótárazásához.

AddDistributedMemoryCacheA NuGet-csomagraMicrosoft.Extensions.Caching.Memory való hivatkozás szükséges.

Note

A csomagok .NET-alkalmazásokhoz való hozzáadásáról a Csomagok telepítése és kezelésea csomaghasználati munkafolyamatban (NuGet-dokumentáció) című cikkben talál útmutatást. Ellenőrizze a megfelelő csomagverziókat a NuGet.org.

Éles elosztott gyorsítótár-szolgáltató konfigurálásához lásd az elosztott gyorsítótárazást a ASP.NET Core-ban.

Warning

Az alkalmazás éles környezetben való üzembe helyezésekor mindig cserélje le a memóriában elosztott jogkivonat-gyorsítótárakat egy valódi jogkivonat-gyorsítótár-szolgáltatóra. Ha nem sikerül egy éles környezetben működő elosztott gyorsítótár-szolgáltatót alkalmaznia a jogkivonatokhoz, az alkalmazás teljesítménye jelentősen romolhat.

Bővebb információért lásd: Tokengyorsítótár szerializálása: Elosztott gyorsítótárak. Azonban a bemutatott kód példák nem vonatkoznak az ASP.NET Core alkalmazásokra, amelyek az elosztott gyorsítótárakat AddDistributedMemoryCache konfigurálják, nem pedig AddDistributedTokenCache.

Használjon megosztott Adatvédelmi kulcsgyűrűt éles környezetben, hogy a webfarm kiszolgálói közötti alkalmazáspéldányok visszafejthessék a jogkivonatokat, amikor MsalDistributedTokenCacheAdapterOptions.Encrypt be van állítva true.

Note

Egy gépen történő korai fejlesztéshez és helyi teszteléshez később beállíthatja Encryptfalse és konfigurálhatja a megosztott adatvédelmi kulcsgyűrűt:

options.Encrypt = false;

A fejlesztési és tesztelési időszak későbbi szakaszában engedélyezze a tokentitkosítást, és vezessen be egy megosztott adatvédelmi kulcsgyűrűt.

Az alábbi példa bemutatja, hogyan használható az Azure Blob Storage és az Azure Key Vault (PersistKeysToAzureBlobStorage/ProtectKeysWithAzureKeyVault) a megosztott kulcsgyűrűhöz. A szolgáltatáskonfigurációk alapeseti forgatókönyvek bemutató célokra. Az éles alkalmazások üzembe helyezése előtt ismerkedjen meg az Azure-szolgáltatásokkal, és fogadja el az ajánlott eljárásokat az Azure-szolgáltatások dedikált dokumentációs készleteivel, amelyek a szakasz végén vannak összekapcsolva.

Adja hozzá a következő csomagokat a következő kiszolgálóprojekthez Blazor Web App:

• Azure.Extensions.AspNetCore.DataProtection.Blobs
• Azure.Extensions.AspNetCore.DataProtection.Keys

Note

A csomagok .NET-alkalmazásokhoz való hozzáadásáról a Csomagok telepítése és kezelésea csomaghasználati munkafolyamatban (NuGet-dokumentáció) című cikkben talál útmutatást. Ellenőrizze a megfelelő csomagverziókat a NuGet.org.

Note

A következő lépések végrehajtása előtt győződjön meg arról, hogy az alkalmazás regisztrálva van a Microsoft Entra szolgáltatásban.

Konfigurálja az Azure Blob Storage-t az adatvédelmi kulcsok karbantartásához. Kövesse az ASP.NET Core kulcstároló-szolgáltatóinak útmutatását.

Konfigurálja az Azure Key Vaultot az inaktív adatvédelmi kulcsok titkosításához. Kövesse az ASP.NET Core Data Protection konfigurálása című útmutatót.

Használja a következő kódot abban a fájlban, amelyben a Program szolgáltatások regisztrálva vannak:

TokenCredential? credential;

if (builder.Environment.IsProduction())
{
    credential = new ManagedIdentityCredential("{MANAGED IDENTITY CLIENT ID}");
}
else
{
    // Local development and testing only
    DefaultAzureCredentialOptions options = new()
    {
        // Specify the tenant ID to use the dev credentials when running the app locally
        // in Visual Studio.
        VisualStudioTenantId = "{TENANT ID}",
        SharedTokenCacheTenantId = "{TENANT ID}"
    };

    credential = new DefaultAzureCredential(options);
}

builder.Services.AddDataProtection()
    .SetApplicationName("{APPLICATION NAME}")
    .PersistKeysToAzureBlobStorage(new Uri("{BLOB URI}"), credential)
    .ProtectKeysWithAzureKeyVault(new Uri("{KEY IDENTIFIER}"), credential);

{MANAGED IDENTITY CLIENT ID}: Az Azure-beli felügyelt Identity ügyfél azonosítója (GUID).

{TENANT ID}: Bérlőazonosító.

{APPLICATION NAME}: SetApplicationName beállítja az alkalmazás egyedi nevét az adatvédelmi rendszeren belül. Az értéknek meg kell egyeznie az alkalmazás üzembe helyezései között.

{BLOB URI}: A kulcsfájl teljes URI-ja. Az URI-t az Azure Storage hozza létre a kulcsfájl létrehozásakor. Ne használjon SAS-t.

{KEY IDENTIFIER}: Kulcstitkosításhoz használt Azure Key Vault-kulcsazonosító. A hozzáférési szabályzat lehetővé teszi, hogy az alkalmazás hozzáférjen a kulcstartóhoz Get, Unwrap Keyés Wrap Key engedélyekkel. A kulcsazonosítót a létrehozás után az Entra vagy az Azure Portal kulcsából szerzi be. Ha engedélyezi a kulcstartó kulcsának automatikus beírását, győződjön meg arról, hogy verzió nélküli kulcsazonosítót használ az alkalmazás kulcstartójának konfigurációjában, ahol nincs kulcs GUID azonosítója az azonosító végén (például: https://contoso.vault.azure.net/keys/data-protection).

Note

Nem éles környezetekben az előző példa a DefaultAzureCredential segítségével leegyszerűsíti a hitelesítést. Az Azure-ba telepítendő alkalmazások fejlesztése során az Azure-beli üzemeltetési környezetek hitelesítő adatait a helyi fejlesztés hitelesítő adataival kombinálja. Az éles környezetbe való áttéréskor jobb választás egy alternatív megoldás, mint az előző példában látható ManagedIdentityCredential. További információ: Azure-ban üzemeltetett .NET-alkalmazások hitelesítése Azure-erőforrásokra rendszer által hozzárendelt felügyelt identitás használatával.

Hívjon meg IDownstreamApi-t és CallApiForUserAsync-t egy felhasználó nevében történő híváskor:

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

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

A BlazorWebAppEntra és BlazorWebAppEntraBff mintaalkalmazások, amelyeket a jelen cikk Mintaalkalmazások részében írnak le, ezt a megközelítést használják.

További információ:

• ASP.NET Core kulcstároló-szolgáltatók
• Az ASP.NET Core Data Protection konfigurálása
• Az Azure SDK for .NET használata ASP.NET Core-alkalmazásokban
• A Web API dokumentációja | Microsoft-identitásplatform
• Webes API-kat hívó webes API: API meghívása: 2. lehetőség: Alsóbb rétegbeli webes API meghívása a segédosztálysal
• IDownstreamApi
• Tegye biztonságossá az ASP.NET Core-Blazor Web App a Microsoft Entra ID-vel
  • Nem BFF minta (Interaktív automatikus folyamat)
  • BFF-minta (interaktív automatikus)
• ASP.NET Core üzemeltetése egy webfarmban: Adatvédelem
• Az Azure Key Vault dokumentációja
• Az Azure Storage dokumentációja
• Hozzáférés biztosítása a Key Vault kulcsaihoz, tanúsítványaihoz és titkos kulcsaihoz az Azure szerepköralapú hozzáférés-vezérlésével

Mintaalkalmazások

A működő példákért tekintse meg a következő mintaalkalmazásokat a Blazor Minták GitHub-adattárában () (dotnet/blazor-samplesletöltés).

BlazorWebAppCallWebApi

Külső (nem a Blazor Web App-ban lévő) internetes feladatlista API meghívása egy Blazor Web App-ből:

• Backend: Egy webes API-alkalmazás, amely minimális API-kon alapuló teendőlistát tart fenn. A web API alkalmazás különálló alkalmazás a Blazor Web App-től, valószínűleg egy másik kiszolgálón van üzemeltetve.
• BlazorApp / BlazorApp.Client: Egy Blazor Web App, amely meghívja a web API-alkalmazást egy HttpClient segítségével a teendőlista-műveletek végrehajtásához, mint például a létrehozás, olvasás, frissítés és törlés a teendőlistában szereplő elemek esetében.

Ügyféloldali renderelés (CSR) esetén, amely magában foglalja az interaktív WebAssembly és automatikus összetevőket, amelyek CSR-t alkalmaznak, a hívások egy előre konfigurált HttpClient segítségével történnek, amely a kliens projekt Program fájljában van regisztrálva (BlazorApp.Client).

builder.Services.AddScoped(sp =>
    new HttpClient
    {
        BaseAddress = new Uri(builder.Configuration["FrontendUrl"] ?? 
            "https://localhost:5002")
    });

A szerveroldali renderelés (SSR) esetén, amely magában foglalja az előrerenderelt és interaktív szerverkomponenseket, az előrerenderelt WebAssembly-komponenseket, valamint az olyan automatikus komponenseket, amelyek előrerendereltek vagy átvették az SSR-t, a hívások a szerverprojekt HttpClient fájljában regisztrált Program-val történnek (BlazorApp):

builder.Services.AddHttpClient();

Hívjon meg egy belső (a Blazor Web App) filmlista API-t, ahol az API a Blazor Web Appkiszolgálóprojektjében található:

• BlazorApp Egy Blazor Web App, amely filmlistát karbantart:
  • Amikor a műveletek a kiszolgálón lévő alkalmazás filmlistáján vannak végrehajtva, a rendszer a szokásos API-hívásokat használja.
  • Ha az API-hívásokat egy webes ügyfél kezdeményezi, a rendszer egy webes API-t használ filmlista-műveletekhez, minimális API-k alapján.
• BlazorApp.Client: A Blazor Web Appügyfélprojektje, amely interaktív webösszetevőket és automatikus összetevőket tartalmaz a filmlista felhasználói kezeléséhez.

Az interaktív WebAssembly-összetevőket és a CSR-t alkalmazó automatikus összetevőket tartalmazó CSR esetében az API-ra irányuló hívások egy ügyfélalapú szolgáltatáson (ClientMovieService) keresztül jönnek létre, amely az ügyfélprojekt HttpClient fájljában (Program) regisztrált előre konfigurált BlazorApp.Client használ. Mivel ezek a hívások nyilvános vagy privát interneten keresztül jönnek létre, a mozgóképlista API egy webes API.

Az alábbi példa lekérte a filmek listáját a /movies végpontról:

public class ClientMovieService(HttpClient http) : IMovieService
{
    public async Task<Movie[]> GetMoviesAsync(bool watchedMovies) => 
        await http.GetFromJsonAsync<Movie[]>("movies") ?? [];
}

Az előre összeállított és interaktív kiszolgálóösszetevőket, előrerendelt WebAssembly-összetevőket és automatikus összetevőket tartalmazó SSR esetében, amelyek előrerendelt vagy elfogadott SSR-t tartalmaznak, a hívásokat közvetlenül egy kiszolgálóalapú szolgáltatáson (ServerMovieService) keresztül bonyolítják le. Az API nem támaszkodik hálózatra, ezért ez egy szabványos API filmlistás CRUD-műveletekhez.

Az alábbi példa a filmek listáját szerzi meg:

public class ServerMovieService(MovieContext db) : IMovieService
{
    public async Task<Movie[]> GetMoviesAsync(bool watchedMovies) => 
        watchedMovies ? 
        await db.Movies.Where(t => t.IsWatched).ToArrayAsync() : 
        await db.Movies.ToArrayAsync();
}

A mozgóképadatok védelméről ebben a forgatókönyvben az adatok biztonságossá tétele interaktív automatikus rendereléssel című, időjárási adatokkal kapcsolatos példában Blazor Web Apptalál további információt.

BlazorWebAppCallWebApi_Weather

Időjárásiadat-mintaalkalmazás, amely streamelési renderelést használ az időjárási adatokhoz.

BlazorWebAssemblyCallWebApi

Webes teendőlista API meghívása egy Blazor WebAssembly-alkalmazásból:

• Backend: Egy webes API-alkalmazás, amely minimális API-kon alapuló teendőlistát tart fenn.
• BlazorTodo: Egy Blazor WebAssembly alkalmazás, amely előre konfigurált HttpClient-vel hívja meg a webes API-t a teendőlista CRUD-műveleteihez.

BlazorWebAssemblyStandaloneWithIdentity

Egy különálló Blazor WebAssembly alkalmazás, amelyet az ASP.NET Core Identitybiztosít.

• Backend: Egy háttérbeli webes API-alkalmazás, amely egy felhasználói identitástárat tart fenn ASP.NET Core Identityszámára.
• BlazorWasmAuth: Egy különálló Blazor WebAssembly előtéralkalmazás felhasználói hitelesítéssel.

A megoldás egy biztonságos webes API meghívását mutatja be a következőkhöz:

• Hitelesített felhasználó szerepköreinek beszerzése.
• Az összes hitelesített felhasználó adatfeldolgozása.
• A jogosult felhasználók (a felhasználónak a szerepkörben Manager kell lennie) adatfeldolgozása engedélyezési szabályzaton keresztül.

BlazorWebAppOidc

Globális automatikus interaktivitással rendelkező Blazor Web App, amely OIDC-hitelesítést használ a Microsoft Entrával Entra-specifikus csomagok használata nélkül. A minta bemutatja, hogyan hívhat meg egy külső biztonságos webes API-t egy tokenkezelő használatával webes API-hívásokhoz .

BlazorWebAppOidcServer

Globális Blazor Web App interaktív kiszolgáló interaktivitással, amely OIDC-hitelesítést használ a Microsoft Entra-val Entra-specifikus csomagok használata nélkül. A minta bemutatja, hogyan adhat át hozzáférési jogkivonatot egy külső biztonságos webes API meghívásához.

BlazorWebAppOidcBff

Globális automatikus interaktivitással rendelkező Blazor Web App, amely a következőket használja:

• OIDC-hitelesítés a Microsoft Entra használatával Entra-specifikus csomagok használata nélkül.
• A Backend for Frontend (BFF) minta, amely egy alkalmazásfejlesztési minta, amely háttérszolgáltatásokat hoz létre a frontend alkalmazásokhoz vagy felületekhez.

A megoldás tartalmazza az időjárási adatok biztonságos beszerzésének bemutatását egy külső webes API-n keresztül, amikor egy interaktív automatikus renderelést alkalmazó összetevő jelenik meg az ügyfélen.

BlazorWebAppEntra

Egy Blazor Web App, amely globális automatikus interaktivitást biztosít, és a Microsoft identitásplatformot használja Microsoft Identity webcsomagokkala Microsoft Entra ID számára. A megoldás tartalmazza az időjárási adatok biztonságos beszerzésének bemutatását egy külső webes API-n keresztül, amikor egy interaktív automatikus renderelést alkalmazó összetevő jelenik meg az ügyfélen.

BlazorWebAppEntraBff

Globális automatikus interaktivitással rendelkező Blazor Web App, amely a következőket használja:

• Microsoft identitásplatformIdentityMicrosoft Entra ID számára.
• A Backend for Frontend (BFF) minta, amely egy alkalmazásfejlesztési minta, amely háttérszolgáltatásokat hoz létre a frontend alkalmazásokhoz vagy felületekhez.

A megoldás tartalmazza az időjárási adatok biztonságos beszerzésének bemutatását egy külső webes API-n keresztül, amikor egy interaktív automatikus renderelést alkalmazó összetevő jelenik meg az ügyfélen.

EltávolításHttpRequestMessage, HttpResponseMessage, és HttpClient

A törzs nélküli HttpRequestMessage nem igényel kifejezett ártalmatlanítást. Az alábbi minták bármelyikével azonban megsemmisítheti:

• using deklaráció (C# 8 vagy újabb):

  using var request = new HttpRequestMessage(...);
  

• using blokk (minden C# verzió):

  using (var request = new HttpRequestMessage(...))
  {
      ...
  }
  

Javasoljuk, hogy minden használatnál dobja ki a HttpRequestMessage a következő okokból:

• A véglegesítők elkerülésével teljesítménybeli javulást érhet el.
• Megerősíti a kódot a jövőre nézve, ha egy kérelemtörzset hozzáadnak egy olyan HttpRequestMessage-hez, amely eredetileg nem rendelkezik ilyennel.
• A funkcionális problémák esetleges elkerülése érdekében, ha egy delegáló kezelő hívásra vár Dispose/DisposeAsync.
• Egyszerűbb mindenhol általános szabályt alkalmazni, mint adott esetekre emlékezni.

Mindig megsemmisítse a HttpResponseMessage példányokat.

Soha ne dobja el a HttpClient hívással CreateClient létrehozott példányokat, mert ezek kezelését a keretrendszer végzi.

Example:

using var request = new HttpRequestMessage(HttpMethod.Get, "/weather-forecast");
var client = clientFactory.CreateClient("ExternalApi");
using var response = await client.SendAsync(request);

Ügyféloldali forgatókönyvek külső webes API-k meghívásához

Az ügyfélalapú összetevők külső webes API-kat hívnak meg a HttpClient példányok használatával, amelyeket általában a HttpClient fájlban regisztrált, előre konfigurált Program segítségével hoznak létre.

builder.Services.AddScoped(sp => 
    new HttpClient
    { 
        BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) 
    });

Az alábbi Razor összetevő a GitHub-ágak webes API-jának kérését küldi el, hasonlóan az Alapszintű használat példához, amely az IHttpClientFactory használatával történő HTTP-kérések készítése ASP.NET Core-cikkben található.

CallWebAPI.razor:

@page "/call-web-api"
@using System.Text.Json
@using System.Text.Json.Serialization
@inject HttpClient Client

<h1>Call web API from a Blazor WebAssembly Razor component</h1>

@if (getBranchesError || branches is null)
{
    <p>Unable to get branches from GitHub. Please try again later.</p>
}
else
{
    <ul>
        @foreach (var branch in branches)
        {
            <li>@branch.Name</li>
        }
    </ul>
}

@code {
    private IEnumerable<GitHubBranch>? branches = [];
    private bool getBranchesError;
    private bool shouldRender;

    protected override bool ShouldRender() => shouldRender;

    protected override async Task OnInitializedAsync()
    {
        using var request = new HttpRequestMessage(HttpMethod.Get,
            "https://api.github.com/repos/dotnet/AspNetCore.Docs/branches");
        request.Headers.Add("Accept", "application/vnd.github.v3+json");
        request.Headers.Add("User-Agent", "HttpClientFactory-Sample");

        using var response = await Client.SendAsync(request);

        if (response.IsSuccessStatusCode)
        {
            using var responseStream = await response.Content.ReadAsStreamAsync();
            branches = await JsonSerializer.DeserializeAsync
                <IEnumerable<GitHubBranch>>(responseStream);
        }
        else
        {
            getBranchesError = true;
        }

        shouldRender = true;
    }

    public class GitHubBranch
    {
        [JsonPropertyName("name")]
        public string? Name { get; set; }
    }
}

Az előző C# 12 vagy újabb példában egy üres tömb ([]) jön létre a branches változóhoz. A .NET 8-nál korábbi SDK-val lefordított C# korábbi verzióihoz hozzon létre egy üres tömböt (Array.Empty<GitHubBranch>()).

A .NET/C# kód és adatok védelméhez használja ASP.NET Core Data Protection-funkciókat egy kiszolgálóoldali ASP.NET Core háttér webes API-val. Az ügyféloldali Blazor WebAssembly alkalmazás meghívja a kiszolgálóoldali webes API-t az alkalmazások biztonságos funkcióinak és adatfeldolgozásának érdekében.

Blazor WebAssembly az alkalmazások gyakran nem kezdeményeznek közvetlen hívásokat a források között a webes API-k felé a több forrásból származó kérelmek megosztásának (CORS) biztonsága miatt. Egy tipikus kivétel a következőhöz hasonló:

Hozzáférés a(z) {URL} lekéréséhez a(z) 'https://localhost:{PORT}'' eredetből a CORS-irányelv miatt le lett tiltva: A kért erőforráson nincs 'Access-Control-Allow-Origin' fejléc. Ha egy átlátszatlan válasz megfelel az igényeinek, állítsa a kérés módját "no-cors" értékre, hogy lekérje az erőforrást, ha a CORS le van tiltva.

Még akkor is, ha a(z) SetBrowserRequestMode hívást BrowserRequestMode mező NoCors (1)-gyel próbálja megkerülni az előző kivételt, a kérés gyakran meghiúsul a webes API eredetére vonatkozó CORS-korlátozások miatt, mint amelyek csak bizonyos eredetről érkező hívásokat engedélyeznek, vagy megakadályozzák, hogy a JavaScript fetch kéréseket a böngészőből tegyenek. Az ilyen hívások kizárólag akkor lehetnek sikeresek, ha a webes API, amelyet meghívsz, lehetővé teszi a saját forrásod számára, hogy a helyes CORS-konfigurációval elérje az ő forrását. A legtöbb külső webes API nem teszi lehetővé a CORS-szabályzatok konfigurálását. A korlátozás kezeléséhez fogadja el az alábbi stratégiák egyikét:

• Saját kiszolgálóoldali ASP.NET Core háttérbeli webes API-t tart fenn. Az ügyféloldali Blazor WebAssembly alkalmazás meghívja a kiszolgálóoldali webes API-t, a webes API pedig a kiszolgálóalapú C#-kódból (nem böngészőből) a külső webes API-ba küldi a kérést a megfelelő CORS-fejlécekkel, és visszaadja az eredményt az ügyféloldali Blazor WebAssembly alkalmazásnak.

• Proxyszolgáltatással irányíthatja a kérést az ügyféloldali Blazor WebAssembly alkalmazásból a külső webes API felé. A proxyszolgáltatás egy kiszolgálóoldali alkalmazással küldi el a kérést az ügyfél nevében, és a hívás sikerességét követően visszaadja az eredményt. Az alábbi példában a CloudFlare CORS PROXYja alapján a {REQUEST URI} helyőrző a kérelem URI-ja:

  @using System.Net
  @inject IHttpClientFactory ClientFactory
  
  ...
  
  @code {
      public async Task CallApi()
      {
          var client = ClientFactory.CreateClient();
  
          var urlEncodedRequestUri = WebUtility.UrlEncode("{REQUEST URI}");
  
          using var request = new HttpRequestMessage(HttpMethod.Get, 
              $"https://corsproxy.io/?{urlEncodedRequestUri}");
  
          using var response = await client.SendAsync(request);
  
          ...
      }
  }
  

Kiszolgálóoldali forgatókönyvek külső webes API-k meghívásához

A kiszolgálóalapú összetevők külső webes API-kat hívnak meg HttpClient példányok használatával, amelyek általában IHttpClientFactoryhasználatával jönnek létre. A kiszolgálóoldali alkalmazásokra vonatkozó útmutatásért lásd: HTTP-kérések létrehozása az IHttpClientFactory használatával a ASP.NET Core-ban.

A kiszolgálóoldali alkalmazások nem tartalmaznak HttpClient szolgáltatást. Adjon meg egy HttpClient az alkalmazásnak a HttpClient gyártási infrastruktúra használatával.

A Program fájlban:

builder.Services.AddHttpClient();

Az alábbi Razor összetevő a GitHub-ágak webes API-jának kérését küldi el, hasonlóan az Alapszintű használat példához, amely az IHttpClientFactory használatával történő HTTP-kérések készítése ASP.NET Core-cikkben található.

CallWebAPI.razor:

@page "/call-web-api"
@using System.Text.Json
@using System.Text.Json.Serialization
@inject IHttpClientFactory ClientFactory

<h1>Call web API from a server-side Razor component</h1>

@if (getBranchesError || branches is null)
{
    <p>Unable to get branches from GitHub. Please try again later.</p>
}
else
{
    <ul>
        @foreach (var branch in branches)
        {
            <li>@branch.Name</li>
        }
    </ul>
}

@code {
    private IEnumerable<GitHubBranch>? branches = [];
    private bool getBranchesError;
    private bool shouldRender;

    protected override bool ShouldRender() => shouldRender;

    protected override async Task OnInitializedAsync()
    {
        using var request = new HttpRequestMessage(HttpMethod.Get,
            "https://api.github.com/repos/dotnet/AspNetCore.Docs/branches");
        request.Headers.Add("Accept", "application/vnd.github.v3+json");
        request.Headers.Add("User-Agent", "HttpClientFactory-Sample");

        var client = ClientFactory.CreateClient();

        using var response = await client.SendAsync(request);

        if (response.IsSuccessStatusCode)
        {
            using var responseStream = await response.Content.ReadAsStreamAsync();
            branches = await JsonSerializer.DeserializeAsync
                <IEnumerable<GitHubBranch>>(responseStream);
        }
        else
        {
            getBranchesError = true;
        }

        shouldRender = true;
    }

    public class GitHubBranch
    {
        [JsonPropertyName("name")]
        public string? Name { get; set; }
    }
}

Az előző C# 12 vagy újabb példában egy üres tömb ([]) jön létre a branches változóhoz. A .NET 8-nál korábbi SDK-val lefordított C# korábbi verzióihoz hozzon létre egy üres tömböt (Array.Empty<GitHubBranch>()).

További példaként tekintse meg azt a kiszolgálóoldali fájlfeltöltési példát, amely fájlokat tölt fel egy webes API-vezérlőbe a ASP.NET Core-fájlfeltöltési Blazor cikkben.

Szolgáltatás absztrakciói webes API-hívásokhoz

Ez a szakasz azokra az s-ekre Blazor Web Appvonatkozik, amelyek webes API-t tartanak fenn a kiszolgálóprojektben, vagy átalakítják a webes API-hívásokat egy külső webes API-vá.

Az interaktív WebAssembly és az automatikus renderelési módok használatakor az összetevők alapértelmezés szerint előre vannak rendezve. Az autóalkatrészeket is kezdetben interaktívan jelenítik meg a szerverről, mielőtt a Blazor csomag letöltődik a kliensre, és az ügyféloldali futtatókörnyezet aktiválódik. Ez azt jelenti, hogy az ilyen renderelési módokat használó összetevőket úgy kell megtervezni, hogy az ügyfélről és a kiszolgálóról is sikeresen fussanak. Ha az összetevőnek meghívnia kell egy kiszolgálói projektalapú API-t, vagy külső webes API-vá kell átalakítania a kérést (amely kívül esik a Blazor Web App) az ügyfélen való futtatáskor, az ajánlott módszer az, ha az API-hívást egy szolgáltatási felület mögött absztrakcióval hajtja végre, és implementálja a szolgáltatás ügyfél- és kiszolgálóverzióit:

• Az ügyfélverzió egy előre konfigurált HttpClient-val hívja meg a webes API-t.
• A kiszolgáló verziója általában közvetlenül is elérheti a kiszolgálóoldali erőforrásokat. A kiszolgálóra visszahívást kezdeményező HttpClient injektálása nem ajánlott, mivel a hálózati kérés általában szükségtelen. Alternatív megoldásként előfordulhat, hogy az API külső a kiszolgálóprojekthez, de a kiszolgáló szolgáltatás absztrakciója szükséges a kérés valamilyen módon történő átalakításához, például hozzáférési jogkivonat hozzáadásához egy előre megadott kéréshez.

A WebAssembly renderelési mód használatakor lehetősége van az előzetes renderelés letiltására is, így az összetevők csak az ügyféloldalon történik a renderelés. További információ: Prerender ASP.NET Core-összetevőkRazor.

Példák (mintaalkalmazások):

• A BlazorWebAppCallWebApi mintaalkalmazás filmlistájának webes API-ja.
• Időjárási adatok webes API-jának streamelése a BlazorWebAppCallWebApi_Weather mintaalkalmazásban.
• Az az időjárási adat, amelyet visszaadnak az ügyfélnek, a BlazorWebAppOidc (nem BFF-minta) vagy a BlazorWebAppOidcBff (BFF-minta) mintaalkalmazásokban található. Ezek az alkalmazások biztonságos (webes) API-hívásokat mutatnak be. További információ: ASP.NET Core Blazor Web App védelme az OpenID Connect (OIDC) használatával.

Blazor Web App külső webes API-k

Ez a szakasz azokra az s-ekre Blazor Web Appvonatkozik, amelyek egy külön (külső) projekt által fenntartott webes API-t hívnak meg, amely esetleg egy másik kiszolgálón fut.

Blazor Web Appnormál esetben az ügyféloldalon előrenderelt WebAssembly-összetevők, és az automatikus összetevők a kiszolgálón jelennek meg statikus vagy interaktív kiszolgálóoldali renderelés (SSR) során. HttpClient szolgáltatások alapértelmezés szerint nincsenek regisztrálva egy Blazor Web Appfő projektjében. Ha az alkalmazás csak a HttpClient.Client projektben regisztrált szolgáltatásokkal fut, a Szolgáltatás hozzáadása HttpClient szakaszban leírtak szerint az alkalmazás végrehajtása futásidejű hibát eredményez:

InvalidOperationException: Nem adható meg érték a "Http" tulajdonsághoz a következő típuson: "... {COMPONENT}". Nincs "System.Net.Http.HttpClient" típusú regisztrált szolgáltatás.

Használja az alábbi módszerek egyikét :

• Adja hozzá a HttpClient szolgáltatásokat a kiszolgálóprojekthez, hogy elérhetővé tegye a HttpClient az SSR során. Használja a következő szolgáltatásregisztrációt a kiszolgálóprojekt Program fájljában:

  builder.Services.AddHttpClient();
  

  HttpClient szolgáltatásokat a megosztott keretrendszer biztosítja, így az alkalmazás projektfájljában nincs szükség csomaghivatkozásra.

  Példa: Teendőlista webes API a BlazorWebAppCallWebApimintaalkalmazásban

• Ha a webes API-t meghívó WebAssembly-összetevőhöz nincs szükség előzetes rendezésre, tiltsa le az előrendelést a Prerender ASP.NET Core-összetevők Razor útmutatását követve. Ha ezt a megközelítést alkalmazza, nem kell HttpClient szolgáltatásokat hozzáadnia a Blazor Web App fő projektjéhez, mert az összetevő nincs előrerendelve a kiszolgálón.

További információ: Az ügyféloldali szolgáltatások nem oldhatók fel az előrendelési cikk előrendelési szakaszában.

Előre megadott adatok

Előrerendezéskor az összetevők kétszer renderelnek: először statikusan, majd interaktívan. Az állapot nem halad át automatikusan az előre beállított összetevőről az interaktívra. Ha egy összetevő aszinkron inicializálási műveleteket hajt végre, és az inicializálás során különböző állapotokat jelenít meg, például "Betöltés..." állapotjelző, villódzás jelenhet meg, amikor az összetevő kétszer renderel.

Ezt úgy oldhatja meg, hogy előre beállított állapotot futtat az Állandó összetevő állapota API-val, amelyet a BlazorWebAppCallWebApiBlazorWebAppCallWebApi_Weather mutatnak be. Ha az összetevő interaktívan jelenik meg, ugyanazt az állapotot jelenítheti meg. További információ:

• ASP.NET Core Blazor előre beállított állapotmegőrzése
• ASP.NET Core Blazor útválasztás és navigáció

Ügyféloldali kérések streamelése

A HTTP/2 protokollt használó Chromium-alapú böngészők (például a Google Chrome és a Microsoft Edge) és a HTTPS esetében az ügyféloldal Blazora Streams API használatával engedélyezi a kérelmek streamelését.

A kérelem-streamelés engedélyezéséhez állítsa a SetBrowserRequestStreamingEnabled-t a true-re a HttpRequestMessage-n.

A következő fájlfeltöltési példában:

• content a fájl HttpContent-je.
• /Filesave az webes API-végpont.
• Http az HttpClient.

using var request = new HttpRequestMessage(HttpMethod.Post, "/Filesave");
request.SetBrowserRequestStreamingEnabled(true);
request.Content = content;

using var response = await Http.SendAsync(request);

Streamelési kérelmek:

• HTTPS protokollt igényel, és nem működik HTTP/1.x rendszeren.
• Tartalmazzon tartalmat, de ne tartalmazzon Content-Length fejlécet. A több forrású streamelési kérelmekhez előzetes kéréssel rendelkező CORS szükséges.

Az összetevővel történő InputFile fájlfeltöltésekről további információt az ASP.NET Alapvető Blazor fájlok feltöltése és a Fájlok feltöltése ügyféloldali rendereléssel (CSR) rendelkező kiszolgálóra című témakörben talál.

A HttpClient szolgáltatás hozzáadása

Az ebben a szakaszban található útmutatás az ügyféloldali forgatókönyvekre vonatkozik.

Az ügyféloldali összetevők webes API-kat hívnak meg egy előre konfigurált HttpClient szolgáltatás használatával, amelynek célja a kérések visszahívása a forráskiszolgálóra. A fejlesztői kódban további HttpClient szolgáltatáskonfigurációk hozhatók létre más webes API-khoz. A kérelmek Blazor JSON-segítők vagy HttpRequestMessagesegítségével állnak össze. A kérések közé tartozhat a Fetch API beállításkonfigurációja.

Az ebben a szakaszban szereplő konfigurációs példák csak akkor hasznosak, ha egyetlen webes API-t hív meg egyetlen HttpClient-példányhoz az alkalmazásban. Ha az alkalmazásnak több webes API-t kell meghívnia, amelyek mindegyike saját alapcímmel és konfigurációval rendelkezik, a következő megközelítéseket alkalmazhatja, amelyekről a cikk későbbi részében olvashat:

• HttpClientNeveIHttpClientFactory: Minden webes API egyedi nevet ad meg. Amikor egy alkalmazáskód vagy egy Razor összetevő meghív egy webes API-t, egy elnevezett HttpClient-példányt használ a hívás indításához.
• Típusos HttpClient: Minden webes API típussal rendelkezik. Amikor egy alkalmazáskód vagy egy Razor összetevő webes API-t hív meg, egy beírt HttpClient-példányt használ a hívás indításához.

A Program fájlban adjon hozzá egy HttpClient szolgáltatást, ha még nem található meg az alkalmazás létrehozásához használt Blazor projektsablonból:

builder.Services.AddScoped(sp => 
    new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });

Az előző példa az alapcímet builder.HostEnvironment.BaseAddress (IWebAssemblyHostEnvironment.BaseAddress) értékre állítja. Ez meghatározza az alkalmazás alapcímét, amely jellemzően a gazdagépoldal <base> címke href értékéből származik.

Az ügyfél saját alapcímének használatára a leggyakoribb használati esetek a következők:

• Egy .Client (.NET 8 vagy újabb) ügyfélprojektje (Blazor Web App) webes API-hívásokat indít a WebAssembly-összetevőkről vagy a WebAssembly-ügyfélen futó kódról a kiszolgálóalkalmazás API-jaira.
• Egy üzemeltetett Client-alkalmazás ügyfélprojektje (Blazor WebAssembly) webes API-hívásokat indít a kiszolgálóprojekthez (Server). Vegye figyelembe, hogy a üzemeltetett Blazor WebAssembly projektsablon már nem érhető el a .NET 8-as vagy újabb verzióiban. A üzemeltetett Blazor WebAssembly-alkalmazások azonban továbbra is támogatottak maradnak a .NET 8-hoz.

Ha külső webes API-t hív meg (nem ugyanabban az URL-térben, mint az ügyfélalkalmazás), állítsa be az URI-t a webes API alapcímére. Az alábbi példa a webes API alapcímét https://localhost:5001értékre állítja, ahol egy külön web API-alkalmazás fut, és készen áll az ügyfélalkalmazás kéréseire való válaszadásra:

builder.Services.AddScoped(sp => 
    new HttpClient { BaseAddress = new Uri("https://localhost:5001") });

JSON-segítők

HttpClient előre konfigurált szolgáltatásként érhető el a kérések forráskiszolgálóra való visszahívásához.

HttpClient és JSON-segítők (System.Net.Http.Json.HttpClientJsonExtensions) külső webes API-végpontok meghívására is használhatók. HttpClient a böngésző Fetch API-jával van implementálva, és azokra a korlátozások vonatkoznak, beleértve az azonos eredetű szabályzat kikényszerítését is, amelyről a cikk későbbi részében, a CORS(Cross-Origin Resource Sharing, CORS) című szakaszban olvashat.

Az ügyfél alapcíme az eredeti kiszolgáló címére van állítva. Szúrjon be egy HttpClient-példányt egy összetevőbe a @inject irányelv használatával:

@using System.Net.Http
@inject HttpClient Http

Használja a System.Net.Http.Json névteret a HttpClientJsonExtensionseléréséhez, beleértve GetFromJsonAsync, PutAsJsonAsyncés PostAsJsonAsync:

@using System.Net.Http.Json

A következő szakaszok a JSON-segítőket ismertetik:

• GET
• POST
• PUT
• PATCH

System.Net.Http további módszereket is tartalmaz a HTTP-kérések küldéséhez és a HTTP-válaszok fogadásához, például a DELETE kérések küldéséhez. További információkért tekintse meg a DELETE és a további bővítménymetelyek szakaszt.

GET a JSON-fájlból (GetFromJsonAsync)

GetFromJsonAsync HTTP GET-kérést küld, és elemzi a JSON-válasz törzsét egy objektum létrehozásához.

A következő komponenskódban a todoItems-et az összetevő jeleníti meg. GetFromJsonAsync akkor hívjuk meg, ha az összetevő inicializálása befejeződött (OnInitializedAsync).

todoItems = await Http.GetFromJsonAsync<TodoItem[]>("todoitems");

POST JSON formátumban (PostAsJsonAsync)

PostAsJsonAsync post kérést küld a megadott URI-nak, amely tartalmazza a kérelem törzsében JSON-ként szerializált értéket.

A következő komponenskódban a newItemName egy kötött elem által van biztosítva. A AddItem metódus egy <button> elem kiválasztásával aktiválódik.

await Http.PostAsJsonAsync("todoitems", addItem);

PostAsJsonAsync visszaad egy HttpResponseMessage. A válaszüzenet JSON-tartalmának deszerializálásához használja a ReadFromJsonAsync bővítménymetódust. Az alábbi példa a JSON időjárási adatait tömbként olvassa be:

var content = await response.Content.ReadFromJsonAsync<WeatherForecast[]>() ?? 
    Array.Empty<WeatherForecast>();

PUT as JSON (PutAsJsonAsync)

PutAsJsonAsync JSON-kódolt tartalommal http PUT-kérést küld.

A következő összetevőkódban editItemName és IsCompleted értékeit az összetevő kötött elemei adják meg. Az elem Id akkor van beállítva, ha az elem ki van jelölve a felhasználói felület egy másik részén (nem jelenik meg), és meghívja EditItem. A SaveItem metódus a <button> elem kiválasztásával aktiválódik. Az alábbi példa nem jeleníti meg a todoItems betöltését a tömörség kedvéért. Az elemek betöltésére példa a GET from JSON (GetFromJsonAsync) szakaszban található.

await Http.PutAsJsonAsync($"todoitems/{editItem.Id}", editItem);

PutAsJsonAsync visszaad egy HttpResponseMessage. A válaszüzenet JSON-tartalmának deszerializálásához használja a ReadFromJsonAsync bővítménymetódust. Az alábbi példa a JSON időjárási adatait tömbként olvassa be:

var content = await response.Content.ReadFromJsonAsync<WeatherForecast[]>() ?? 
    Array.Empty<WeatherForecast>();

PATCH JSON formátumban (PatchAsJsonAsync)

PatchAsJsonAsync JSON-kódolt tartalommal HTTP PATCH-kérést küld.

Note

További információ: JsonPatch a ASP.NET Core webes API-ban.

Az alábbi példában a PatchAsJsonAsync egy JSON PATCH-dokumentumot kap egyszerű szövegként, escape-elt idézőjelekkel.

await Http.PatchAsJsonAsync(
    $"todoitems/{id}", 
    "[{\"operationType\":2,\"path\":\"/IsComplete\",\"op\":\"replace\",\"value\":true}]");

C# 11 (.NET 7) esetén egy JSON-szöveget nyers sztringkonstansként állíthat össze. Adja meg a JSON-szintaxist a StringSyntaxAttribute.Json mező segítségével a [StringSyntax] attribútumhoz a kódelemzési eszköz számára:

@using System.Diagnostics.CodeAnalysis

...

@code {
    [StringSyntax(StringSyntaxAttribute.Json)]
    private const string patchOperation =
        """[{"operationType":2,"path":"/IsComplete","op":"replace","value":true}]""";

    ...

    await Http.PatchAsJsonAsync($"todoitems/{id}", patchOperation);
}

PatchAsJsonAsync visszaad egy HttpResponseMessage. A válaszüzenet JSON-tartalmának deszerializálásához használja a ReadFromJsonAsync bővítménymetódust. Az alábbi példa a JSON-elemek adatait olvassa tömbként. Üres tömb jön létre, ha a metódus nem ad vissza elemadatokat, így content nem null értékű az utasítás végrehajtása után:

using var response = await Http.PatchAsJsonAsync(...);
var content = await response.Content.ReadFromJsonAsync<TodoItem[]>() ??
    Array.Empty<TodoItem>();

A behúzással, térközrel és kibontatlan idézőjelekkel tagolt, kódolatlan PATCH-dokumentum a következő JSON-ként jelenik meg:

[
  {
    "operationType": 2,
    "path": "/IsComplete",
    "op": "replace",
    "value": true
  }
]

Ha egyszerűsíteni szeretné a PATCH-dokumentumok létrehozását a PATCH-kérelmeket kibocsátó alkalmazásban, az alkalmazás a .NET JSON PATCH-támogatást használhatja, ahogyan az alábbi útmutató is mutatja.

Telepítse a Microsoft.AspNetCore.JsonPatch.SystemTextJson NuGet-csomagot, és a csomag API-funkcióival írjon JsonPatchDocument egy PATCH-kéréshez.

Note

A csomagok .NET-alkalmazásokhoz való hozzáadásáról a Csomagok telepítése és kezelésea csomaghasználati munkafolyamatban (NuGet-dokumentáció) című cikkben talál útmutatást. Ellenőrizze a megfelelő csomagverziókat a NuGet.org.

Adjon hozzá @using direktívákat a System.Text.Json, System.Text.Json.Serialization, és Microsoft.AspNetCore.JsonPatch.SystemTextJson névterekhez az Razor összetevő tetejére:

@using System.Text.Json
@using System.Text.Json.Serialization
@using Microsoft.AspNetCore.JsonPatch.SystemTextJson

Készítse el a JsonPatchDocument-t egy TodoItem számára, ahol a(z) IsComplete értéke true, a(z) JsonPatchDocument.Replace módszerrel:

var patchDocument = new JsonPatchDocument<TodoItem>()
    .Replace(p => p.IsComplete, true);

Adja át a dokumentum műveleteit (patchDocument.Operations) a PatchAsJsonAsync hívásnak:

private async Task UpdateItem(long id)
{
    await Http.PatchAsJsonAsync(
        $"todoitems/{id}", 
        patchDocument.Operations, 
        new JsonSerializerOptions()
        {
            DefaultIgnoreCondition = JsonIgnoreCondition.WhenWritingDefault
        });
}

JsonSerializerOptions.DefaultIgnoreCondition úgy van beállítva, hogy JsonIgnoreCondition.WhenWritingDefault figyelmen kívül hagyjon egy tulajdonságot, ha az megegyezik a típus alapértelmezett értékével.

Állítsa be a JsonSerializerOptions.WriteIndented-et a true-re, ha a JSON hasznos adatait kellemes megjelenítési formátumban szeretné mutatni. A behúzott JSON írása nem befolyásolja a PATCH-kérések feldolgozását, és általában nem történik meg éles alkalmazásokban webes API-kérésekhez.

Kövesse a ASP.NET Core webes API-cikkben található JsonPatch útmutatót a PATCH vezérlő művelet webes API-hoz való hozzáadásához. Alternatív megoldásként a PATCH-kérelmek feldolgozása minimális API-ként is megvalósítható az alábbi lépésekkel.

Adjon hozzá egy csomaghivatkozást a Microsoft.AspNetCore.JsonPatch.SystemTextJson NuGet-csomaghoz a web API-alkalmazáshoz.

A Program fájlban adjon hozzá egy @using irányelvet a Microsoft.AspNetCore.JsonPatch.SystemTextJson névtérhez:

using Microsoft.AspNetCore.JsonPatch.SystemTextJson;

Adja meg a végpontot a webes API kérésfeldolgozási folyamatának:

app.MapPatch("/todoitems/{id}", async (long id, TodoContext db) =>
{
    if (await db.TodoItems.FindAsync(id) is TodoItem todo)
    {
        var patchDocument = 
            new JsonPatchDocument<TodoItem>().Replace(p => p.IsComplete, true);
        patchDocument.ApplyTo(todo);
        await db.SaveChangesAsync();

        return TypedResults.Ok(todo);
    }

    return TypedResults.NotFound();
});

Warning

A ASP.NET Core webes API-cikkben szereplő JsonPatch-példához hasonlóan az előző PATCH API nem védi a webes API-t a túlzott közzétételi támadásoktól. További információ : Oktatóanyag: Vezérlőalapú webes API létrehozása a ASP.NET Core használatával.

A patch teljes körű működéséhez tekintse meg a BlazorWebAppCallWebApi.

DELETE (DeleteAsync) és további bővítőmódszerek

System.Net.Http további bővítménymetelyeket is tartalmaz a HTTP-kérések küldéséhez és a HTTP-válaszok fogadásához. HttpClient.DeleteAsync HTTP DELETE-kérés webes API-nak való elküldésére szolgál.

Az alábbi összetevőkódban a <button> elem meghívja a DeleteItem metódust. A kötött <input> elem adja meg a törlendő elem id értékét.

await Http.DeleteAsync($"todoitems/{id}");

HttpClient néven IHttpClientFactory

A IHttpClientFactory szolgáltatások és a megnevezett HttpClient konfiguráció támogatott.

Note

Az HttpClient-ből való névvel ellátott IHttpClientFactory használat helyett egy típusos HttpClient használata lehet alternatíva. További információkért lásd a Typed HttpClient szakaszt.

Adja hozzá a Microsoft.Extensions.Http NuGet-csomagot az alkalmazáshoz.

Note

A csomagok .NET-alkalmazásokhoz való hozzáadásáról a Csomagok telepítése és kezelésea csomaghasználati munkafolyamatban (NuGet-dokumentáció) című cikkben talál útmutatást. Ellenőrizze a megfelelő csomagverziókat a NuGet.org.

Egy ügyfélprojekt Program fájljában:

builder.Services.AddHttpClient("WebAPI", client => 
    client.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress));

Ha a névvel ellátott ügyfelet egy Blazor Web Appelőrerendezett ügyféloldali összetevői használják, az előző szolgáltatásregisztrációnak a kiszolgálóprojektben és a .Client projektben is meg kell jelennie. A kiszolgálón a builder.HostEnvironment.BaseAddress a webes API alapcíme váltja fel, amelyet az alábbiakban ismertetünk.

Az előző kliensoldali példa az alapcímet builder.HostEnvironment.BaseAddress (IWebAssemblyHostEnvironment.BaseAddress) értékre állítja, amely meghatározza a kliensoldali alkalmazás alapcímét, és amely általában a hoszt oldal <base> címkéjének href értékéből származik.

Az ügyfél saját alapcímének használatára a leggyakoribb használati esetek a következők:

• Egy olyan .Client kliensprojekt (Blazor Web App), amely webes API-hívásokat indít a WebAssembly/Auto komponensekből vagy a WebAssembly-ben ügyfélen futó kódból a kiszolgáló alkalmazás API-jaihoz ugyanazon a gazda címén.
• Egy üzemeltetett Client alkalmazás ügyfélprojektje (Blazor WebAssembly), amely webes API-hívásokat indít a kiszolgálóprojekthez (Server).

Ha külső webes API-t hív meg (nem ugyanabban az URL-címen, mint az ügyfélalkalmazás), vagy egy kiszolgálóoldali alkalmazásban konfigurálja a szolgáltatásokat (például az ügyféloldali összetevők előrendelésével foglalkozik a kiszolgálón), állítsa be az URI-t a webes API alapcímére. Az alábbi példa a webes API alapcímét https://localhost:5001értékre állítja, ahol egy külön web API-alkalmazás fut, és készen áll az ügyfélalkalmazás kéréseire való válaszadásra:

builder.Services.AddHttpClient("WebAPI", client => 
    client.BaseAddress = new Uri("https://localhost:5001"));

Az alábbi összetevőkódban:

• A IHttpClientFactory példánya létrehoz egy elnevezett HttpClient.
• A HttpClient nevű elemet használják arra, hogy GET kérést küldjön JSON formátumú időjárás-előrejelzés adatokért a web API-tól a /forecast webcímén.

@inject IHttpClientFactory ClientFactory

...

@code {
    private Forecast[]? forecasts;

    protected override async Task OnInitializedAsync()
    {
        var client = ClientFactory.CreateClient("WebAPI");

        forecasts = await client.GetFromJsonAsync<Forecast[]>("forecast") ?? [];
    }
}

A BlazorWebAppCallWebApimintaalkalmazás bemutatja, hogyan lehet egy webes API-t meghívni egy HttpClient nevű CallTodoWebApiCsrNamedClient összetevőt használva. Egy ügyfélalkalmazásban a Microsoft Graph nevű HttpClient meghívásával történő további működési bemutatóhoz lásd a Graph API használata ASP.NET Core használatával című témakört Blazor WebAssembly.

Gépelt HttpClient

A beírt HttpClient az alkalmazás egy vagy több alapértelmezett vagy elnevezett HttpClient példányát használja egy vagy több webes API-végpont adatainak visszaadásához.

Note

A gépelt HttpClient helyett használható egy HttpClient-ből származó nevesített IHttpClientFactory. További információkért lásd a Named HttpClient with IHttpClientFactory szakaszt.

Adja hozzá a Microsoft.Extensions.Http NuGet-csomagot az alkalmazáshoz.

Note

A csomagok .NET-alkalmazásokhoz való hozzáadásáról a Csomagok telepítése és kezelésea csomaghasználati munkafolyamatban (NuGet-dokumentáció) című cikkben talál útmutatást. Ellenőrizze a megfelelő csomagverziókat a NuGet.org.

Az alábbi példa GET kérést küld a webes API-hoz, hogy JSON formátumú időjárás-előrejelzési adatokat kapjon a /forecast-ból.

ForecastHttpClient.cs:

using System.Net.Http.Json;

namespace BlazorSample.Client;

public class ForecastHttpClient(HttpClient http)
{
    public async Task<Forecast[]> GetForecastAsync() => 
        await http.GetFromJsonAsync<Forecast[]>("forecast") ?? [];
}

Egy ügyfélprojekt Program fájljában:

builder.Services.AddHttpClient<ForecastHttpClient>(client => 
    client.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress));

Ha a beírt ügyfelet egy Blazor Web Appelőre beállított ügyféloldali összetevői használják, az előző szolgáltatásregisztrációnak a kiszolgálóprojektben és a .Client projektben is meg kell jelennie. A kiszolgálón a builder.HostEnvironment.BaseAddress a webes API alapcíme váltja fel, amelyet az alábbiakban ismertetünk.

Az előző példa beállítja az alapcímet builder.HostEnvironment.BaseAddress (IWebAssemblyHostEnvironment.BaseAddress) értékre, amely az ügyféloldali alkalmazás alapcímét lekéri, és általában a gazdahonlap <base> címkéjének href értékéből kerül levezetésre.

Az ügyfél saját alapcímének használatára a leggyakoribb használati esetek a következők:

• Egy olyan .Client kliensprojekt (Blazor Web App), amely webes API-hívásokat indít a WebAssembly/Auto komponensekből vagy a WebAssembly-ben ügyfélen futó kódból a kiszolgáló alkalmazás API-jaihoz ugyanazon a gazda címén.
• Egy üzemeltetett Client alkalmazás ügyfélprojektje (Blazor WebAssembly), amely webes API-hívásokat indít a kiszolgálóprojekthez (Server).

Ha külső webes API-t hív meg (nem ugyanabban az URL-címen, mint az ügyfélalkalmazás), vagy egy kiszolgálóoldali alkalmazásban konfigurálja a szolgáltatásokat (például az ügyféloldali összetevők előrendelésével foglalkozik a kiszolgálón), állítsa be az URI-t a webes API alapcímére. Az alábbi példa a webes API alapcímét https://localhost:5001értékre állítja, ahol egy külön web API-alkalmazás fut, és készen áll az ügyfélalkalmazás kéréseire való válaszadásra:

builder.Services.AddHttpClient<ForecastHttpClient>(client => 
    client.BaseAddress = new Uri("https://localhost:5001"));

Az összetevők a típusos HttpClient-t injektálják a webes API meghívásához.

Az alábbi összetevőkódban:

• Az előző ForecastHttpClient egy példánya van beinjektálva, amely egy típusos HttpClient-et hoz létre.
• A beírt HttpClient a webes API-ból származó JSON időjárás-előrejelzési adatokra vonatkozó GET-kérés kiállítására szolgál.

@inject ForecastHttpClient Http

...

@code {
    private Forecast[]? forecasts;

    protected override async Task OnInitializedAsync()
    {
        forecasts = await Http.GetForecastAsync();
    }
}

A BlazorWebAppCallWebApimintaalkalmazás bemutatja, hogyan lehet egy webes API-t meghívni egy típussal rendelkező HttpClientCallTodoWebApiCsrTypedClient összetevőben. Vegye figyelembe, hogy az összetevő InteractiveWebAssembly fogadja el az ügyféloldali renderelést (CSR) (renderelési mód), így a beírt ügyfélszolgáltatás-regisztráció mind a Program kiszolgálóprojekt, mind a .Client projekt fájljában megjelenik.

Cookie-alapú kérés hitelesítési adatok

Az ebben a szakaszban található útmutatás a hitelesítésre cookietámaszkodó ügyféloldali forgatókönyvekre vonatkozik.

Az cookie-alapú hitelesítés esetében, amelyet biztonságosabbnak tartanak, mint a bearer token hitelesítést, a cookie hitelesítő adatok minden webes API-kéréshez elküldhetők a AddHttpMessageHandler hívásával egy előre konfigurált DelegatingHandler-en a HttpClient használatával. A kezelő a SetBrowserRequestCredentials-t konfigurálja a BrowserRequestCredentials.Include-el, amely azt javasolja a böngészőnek, hogy minden kéréshez küldjön hitelesítő adatokat, például cookie-kat vagy HTTP-hitelesítési fejléceket, beleértve a kereszt-domain kéréseket is.

CookieHandler.cs:

public class CookieHandler : DelegatingHandler
{
    protected override Task<HttpResponseMessage> SendAsync(
        HttpRequestMessage request, CancellationToken cancellationToken)
    {
        request.SetBrowserRequestCredentials(BrowserRequestCredentials.Include);
        request.Headers.Add("X-Requested-With", [ "XMLHttpRequest" ]);

        return base.SendAsync(request, cancellationToken);
    }
}

Note

Útmutatást arra vonatkozóan, hogyan férhet hozzá egy AuthenticationStateProvider egy DelegatingHandler-ból, az ASP.NET Core kiszolgálóoldali és Blazor Web App további biztonsági forgatókönyvek című szakaszban találhat.

A CookieHandler regisztrálva van a Program fájlban:

builder.Services.AddTransient<CookieHandler>();

Az üzenetkezelő hozzáadódik minden olyan előre konfigurált HttpClient-hoz, amely(ek) cookie hitelesítést igényel(nek).

builder.Services.AddHttpClient(...)
    .AddHttpMessageHandler<CookieHandler>();

Lásd az ASP.NET Core biztonságának Blazor WebAssembly segítségével.

Amikor egy HttpRequestMessage-t készít, közvetlenül állítsa be a böngésző kérésének hitelesítő adatait és fejlécét:

using var request = new HttpRequestMessage() { ... };

request.SetBrowserRequestCredentials(BrowserRequestCredentials.Include);
request.Headers.Add("X-Requested-With", [ "XMLHttpRequest" ]);

HttpClient és HttpRequestMessage a Fetch API kéréshez tartozó opciókkal

Az ebben a szakaszban található útmutatás azokra az ügyféloldali forgatókönyvekre vonatkozik, amelyek tulajdonosi jogkivonat-hitelesítésre támaszkodnak.

HttpClient (API-dokumentáció) és HttpRequestMessage a kérések testreszabására használható. Megadhatja például a HTTP-metódust és a kérelemfejléceket. Az alábbi összetevő egy POST kérést küld egy webes API-végpontra, és megjeleníti a válasz törzsét.

TodoRequest.razor:

@page "/todo-request"
@using System.Net.Http.Headers
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@inject HttpClient Http
@inject IAccessTokenProvider TokenProvider

<h1>ToDo Request</h1>

<h1>ToDo Request Example</h1>

<button @onclick="PostRequest">Submit POST request</button>

<p>Response body returned by the server:</p>

<p>@responseBody</p>

@code {
    private string? responseBody;

    private async Task PostRequest()
    {
        using var request = new HttpRequestMessage()
        {
            Method = new HttpMethod("POST"),
            RequestUri = new Uri("https://localhost:10000/todoitems"),
            Content =
                JsonContent.Create(new TodoItem
                {
                    Name = "My New Todo Item",
                    IsComplete = false
                })
        };

        var tokenResult = await TokenProvider.RequestAccessToken();

        if (tokenResult.TryGetToken(out var token))
        {
            request.Headers.Authorization =
                new AuthenticationHeaderValue("Bearer", token.Value);

            request.Content.Headers.TryAddWithoutValidation(
                "x-custom-header", "value");

            using var response = await Http.SendAsync(request);
            var responseStatusCode = response.StatusCode;

            responseBody = await response.Content.ReadAsStringAsync();
        }
    }

    public class TodoItem
    {
        public long Id { get; set; }
        public string? Name { get; set; }
        public bool IsComplete { get; set; }
    }
}

Blazor ügyféloldali HttpClient implementáció a Fetch API-t használja, és a mögöttes kérésspecifikus Fetch API-beállításokatHttpRequestMessage bővítménymetódusokkal és WebAssemblyHttpRequestMessageExtensions konfigurálja. Adjon meg további beállításokat az általános SetBrowserRequestOption bővítménymetódus használatával. Blazor és az alapul szolgáló Fetch API nem ad hozzá vagy módosít közvetlenül kérésfejléceket. A felhasználói ügynökök, például a böngészők és a fejlécek használatáról a külső felhasználói ügynök dokumentációs készletei és egyéb webes erőforrások segítségével tájékozódhat.

A válaszstreamelés alapértelmezés szerint engedélyezve van.

HttpContent.ReadAsStreamAsync HttpResponseMessage.Content (response.Content.ReadAsStreamAsync()) hívása egy BrowserHttpReadStream (referenciaforrás) értéket ad vissza, nem pedig egy MemoryStream. BrowserHttpReadStream nem támogatja a szinkron műveleteket, például Stream.Read(Span<Byte>). Ha a kódja szinkron műveleteket használ, leiratkozhat a válasz streameléséről, vagy saját maga átmásolhatja a Stream-t egy MemoryStream-be.

Note

A .NET referenciaforrásra mutató dokumentációs hivatkozások általában betöltik az adattár alapértelmezett ágát, amely a .NET következő kiadásának aktuális fejlesztését jelöli. Ha ki szeretne jelölni egy címkét egy adott kiadáshoz, használja az Ágak vagy címkék váltása legördülő listát. További információ : A ASP.NET Core-forráskód (dotnet/AspNetCore.Docs #26205) verziócímkéjének kiválasztása.

Ha globálisan szeretné letiltani a válaszstreamelést, használja az alábbi módszerek egyikét:

• Adja hozzá a <WasmEnableStreamingResponse> tulajdonságot a projektfájlhoz a következő falseértékkel:

  <WasmEnableStreamingResponse>false</WasmEnableStreamingResponse>
  

• Állítsa a környezeti változót DOTNET_WASM_ENABLE_STREAMING_RESPONSE értékre false vagy 0.

Ha le szeretné tiltani a válaszstreamelést egy adott kéréshez, állítsa a SetBrowserResponseStreamingEnabled mezőt false értékről HttpRequestMessage értékre (request az alábbi példában).

request.SetBrowserResponseStreamingEnabled(false);

Ha hitelesítő adatokat szeretne szerepeltetni egy forrásközi kérelemben, használja a SetBrowserRequestCredentials bővítménymetódust:

request.SetBrowserRequestCredentials(BrowserRequestCredentials.Include);

Az API-beállítások beolvasásával kapcsolatos további információkért tekintse meg az MDN webes dokumentumait: WindowOrWorkerGlobalScope.fetch(): Paraméterek.

Hibák kezelése

A webes API válaszhibáinak kezelése a fejlesztői kódban, amikor azok előfordulnak. Például a GetFromJsonAsync egy JSON-választ vár a Content-Typeapplication/json-től a webes API-n keresztül. Ha a válasz nem JSON formátumban van, a tartalomérvényesítés NotSupportedExceptioneredményez.

Az alábbi példában az időjárás-előrejelzési adatkérelem URI-végpontja hibás. Az URI-nak WeatherForecast kell lennie, de WeatherForcastnéven jelenik meg a hívásban, és hiányzik belőle a eForecast betűje.

A GetFromJsonAsync hívásnál JSON visszaadása várható, de egy nem kezelt kivétel esetén a webes API HTML-t ad vissza Content-Typetext/html értékkel. A kezeletlen kivétel azért fordul elő, mert a /WeatherForcast elérési útja nem található, és a köztes szoftver nem tudja kiszolgálni a kérés lapját vagy nézetét.

Az OnInitializedAsync ügyfélnél NotSupportedException akkor generálódik, amikor a válasz tartalmát érvénytelenként azonosítják, mivel nem JSON. A kivétel a catch blokkban jelenik meg, ahol az egyéni logika naplózhatja a hibát, vagy egy rövid hibaüzenetet jeleníthet meg a felhasználónak.

ReturnHTMLOnException.razor:

@page "/return-html-on-exception"
@using {PROJECT NAME}.Shared
@inject HttpClient Http

<h1>Fetch data but receive HTML on unhandled exception</h1>

@if (forecasts == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <h2>Temperatures by Date</h2>

    <ul>
        @foreach (var forecast in forecasts)
        {
            <li>
                @forecast.Date.ToShortDateString():
                @forecast.TemperatureC &#8451;
                @forecast.TemperatureF &#8457;
            </li>
        }
    </ul>
}

<p>
    @exceptionMessage
</p>

@code {
    private WeatherForecast[]? forecasts;
    private string? exceptionMessage;

    protected override async Task OnInitializedAsync()
    {
        try
        {
            // The URI endpoint "WeatherForecast" is misspelled on purpose on the 
            // next line. See the preceding text for more information.
            forecasts = await Http.GetFromJsonAsync<WeatherForecast[]>("WeatherForcast");
        }
        catch (NotSupportedException exception)
        {
            exceptionMessage = exception.Message;
        }
    }
}

Note

Az előző példa szemléltetési célokra szolgál. A webes API-k úgy konfigurálhatók, hogy akkor is visszaadják a JSON-t, ha egy végpont nem létezik, vagy nem kezelt kivétel történik a kiszolgálón.

További információ: ASP.NET Core-alkalmazások Blazor hibáinak kezelése.

Forrásközi erőforrás-megosztás (CORS)

A böngésző biztonsága gyakran korlátozza, hogy egy weblap kéréseket küldjön a weblapot kézbesítőtől eltérő forrásra. Ezt a korlátozást azonos eredetű szabályzatnak nevezzük. Az azonos eredetű házirend korlátozza (de nem akadályozza meg) a rosszindulatú webhelyet abban, hogy bizalmas adatokat olvasson egy másik webhelyről. Ha a böngészőből egy másik forrású végpontra szeretne kéréseket küldeni, a végpontnak engedélyeznie kell a forrásközi erőforrás-megosztást (CORS).

A kiszolgálóoldali CORS-ról további információt a ASP.NET Core-ban található keresztirányú kérelmek engedélyezése (CORS) című témakörben talál. A cikk példái nem közvetlenül Razor összetevő-forgatókönyvekre vonatkoznak, de a cikk hasznos az általános CORS-fogalmak megismeréséhez.

További információ az ügyféloldali CORS-kérelmekről: ASP.NET Core Blazor WebAssembly további biztonsági forgatókönyvek.

Hamisítás elleni támogatás

Ha antiforgery-támogatást szeretne hozzáadni egy HTTP-kéréshez, szúrja be a AntiforgeryStateProvider-t, és adjon hozzá egy RequestToken-et a fejlécgyűjteményhez, mint RequestVerificationToken.

@inject AntiforgeryStateProvider Antiforgery

private async Task OnSubmit()
{
    var antiforgery = Antiforgery.GetAntiforgeryToken();
    using var request = new HttpRequestMessage(HttpMethod.Post, "action");
    request.Headers.Add("RequestVerificationToken", antiforgery.RequestToken);
    using var response = await client.SendAsync(request);
    ...
}

További információ: ASP.NET Core-hitelesítés Blazor és -engedélyezés.

Blazor keretrendszerösszetevő-példák a webes API-hozzáférés teszteléséhez

Különböző hálózati eszközök nyilvánosan elérhetők a webes API háttéralkalmazásainak közvetlen teszteléséhez, például a Firefox Browser Developerhez. Blazor keretrendszer referenciaforrása HttpClient teszteléshez hasznos teszteszközöket tartalmaz:

HttpClientTest objektumok a dotnet/aspnetcore GitHub-adattárban

Note

A .NET referenciaforrásra mutató dokumentációs hivatkozások általában betöltik az adattár alapértelmezett ágát, amely a .NET következő kiadásának aktuális fejlesztését jelöli. Ha ki szeretne jelölni egy címkét egy adott kiadáshoz, használja az Ágak vagy címkék váltása legördülő listát. További információ : A ASP.NET Core-forráskód (dotnet/AspNetCore.Docs #26205) verziócímkéjének kiválasztása.

További erőforrások

General

• Forrásközi erőforrás-megosztás (CORS) a W3C-n
• Kereszt-eredetű kérelmek (CORS) engedélyezése a ASP.NET Core-ban: Bár a tartalom ASP.NET Core-alkalmazásokra vonatkozik, nem Razor összetevőkre, a cikk általános CORS-fogalmakat tartalmaz.
• Adatok Blazor Web Appbiztonságossá tétele interaktív automatikus rendereléssel

A túladatküldési támadások enyhítése

A webes API-k sebezhetők lehetnek egy túlpostázó támadással, más néven tömeges hozzárendelési támadással szemben. A túlpostolásos támadás akkor fordul elő, ha egy rosszindulatú felhasználó egy POST HTML-űrlapot ad ki a kiszolgálónak, amely olyan tulajdonságok adatait dolgozza fel, amelyek nem részei a renderelt űrlapnak, és hogy a fejlesztő nem kívánja engedélyezni a felhasználók számára a módosítást. A "túlküldés" kifejezés szó szerint azt jelenti, hogy a rosszindulatú felhasználó túl sokszor POST-olta az űrlapot.

A túlpostolásos támadások mérséklésével kapcsolatos útmutatásért tekintse meg az Oktatóanyag: Vezérlőalapú webes API létrehozása az ASP.NET Core-n.

Server-side

• ASP.NET Alapvető kiszolgálóoldali és Blazor Web App további biztonsági forgatókönyvek: Magában foglalja a biztonságos webes API-kérések készítésére vonatkozó HttpClient lefedettséget.
• HTTP-kérések létrehozása az IHttpClientFactory használatával a ASP.NET Core-ban
• HTTPS kényszerítése a ASP.NET Core-ban
• Kestrel HTTPS-végpont konfigurálása

Client-side

• ASP.NET Alapvető Blazor WebAssembly további biztonsági forgatókönyvek: Magában foglalja a biztonságos webes API-kérések készítésére vonatkozó HttpClient lefedettséget.
• A Graph API használata a ASP.NET Core használatával Blazor WebAssembly
• API lekérése