Sdílet prostřednictvím


Hostování a nasazení aplikací ASP.NET Core Blazor

Poznámka:

Toto není nejnovější verze tohoto článku. Aktuální verzi najdete ve verzi .NET 8 tohoto článku.

Důležité

Tyto informace se týkají předběžného vydání produktu, který může být podstatně změněn před komerčním vydáním. Microsoft neposkytuje žádné záruky, výslovné ani předpokládané, týkající se zde uváděných informací.

Aktuální verzi najdete ve verzi .NET 8 tohoto článku.

Tento článek vysvětluje, jak hostovat a nasazovat aplikace Blazor.

Publikování aplikace

Aplikace se publikují pro nasazení v konfiguraci vydané verze.

Poznámka:

Publikujte hostované Blazor WebAssemblyřešení z projektu Server.

  1. V nabídce Sestavení vyberte příkaz Publikovat {APPLICATION}, kde {APPLICATION} je zástupný název aplikace.
  2. Vyberte cíl publikování. Pokud chcete publikovat místně, vyberte Složka.
  3. Přijměte výchozí umístění v poli Zvolit složku, nebo zadejte jiné umístění. Vyberte tlačítko Publish.

Publikováním aplikace se aktivuje obnovení závislostí projektu a sestaví projekt před vytvořením prostředků pro nasazení. V rámci procesu sestavení se odeberou nepoužívané metody a sestavení, aby se snížila velikost pro stahování a doba načítání aplikace.

Umístění publikování:

  • Blazor Webová aplikace: Ve výchozím nastavení se aplikace publikuje do /bin/Release/{TARGET FRAMEWORK}/publish složky. Nasaďte obsah složky publish do hostitele.
  • Blazor WebAssembly: Ve výchozím nastavení se aplikace publikuje do bin\Release\net8.0\browser-wasm\publish\ složky. Pokud chcete aplikaci nasadit jako statický web, zkopírujte obsah složky wwwroot do hostitele statického webu.
  • Blazor Server: Ve výchozím nastavení se aplikace publikuje do /bin/Release/{TARGET FRAMEWORK}/publish složky. Nasaďte obsah složky publish do hostitele.
  • Blazor WebAssembly
    • Samostatná aplikace: Ve výchozím nastavení se aplikace publikuje do /bin/Release/{TARGET FRAMEWORK}/publish/wwwroot složky nebo bin\Release\{TARGET FRAMEWORK}\browser-wasm\publish do složky v závislosti na verzi sady SDK použité k publikování aplikace. Pokud chcete aplikaci nasadit jako statický web, zkopírujte obsah složky wwwroot do hostitele statického webu.
    • Hostované: Klientská Blazor WebAssembly aplikace se publikuje do /bin/Release/{TARGET FRAMEWORK}/publish/wwwroot složky serverové aplikace spolu s dalšími statickými webovými prostředky klientské aplikace. Nasaďte obsah složky publish do hostitele.

V {TARGET FRAMEWORK} předchozích cestách je cílová architektura (například net8.0).

IIS

Pokud chcete hostovat aplikaci ve službě Blazor IIS, projděte si následující zdroje informací:

Sdílení fondu aplikací mezi aplikacemi ASP.NET Core se nepodporuje, včetně aplikací Blazor. Při hostování se službou IIS používejte jeden fond aplikací a vyhněte se používání virtuálních adresářů služby IIS pro hostování více aplikací.

Jedna nebo více aplikací Blazor WebAssembly hostovaných aplikací ASP.NET Core, označovaných jako hostované řešení Blazor WebAssembly, se podporuje pro jeden fond aplikací. Nedoporučujeme ani nepodporujeme přiřazení jednoho fondu aplikací několika hostovaným řešením Blazor WebAssembly nebo ve scénářích hostování dílčích aplikací.

Další informace o řešeních najdete v tématu Nástroje pro ASP.NET Core Blazor.

Základní cesta aplikace

Základní cesta aplikace je kořenová cesta URL aplikace. Úspěšné směrování v Blazor aplikacích vyžaduje konfiguraci architektury pro jakoukoli kořenovou cestu URL, která není na výchozí základní cestě /aplikace .

Představte si následující aplikaci ASP.NET Core a dílčí aplikaci Blazor:

  • Aplikace ASP.NET Core má název MyApp:
    • Aplikace se fyzicky nachází v cestě d:/MyApp.
    • Žádosti se přijímají na adrese https://www.contoso.com/{MYAPP RESOURCE}.
  • Aplikace Blazor s názvem CoolApp je dílčí aplikací MyApp:
    • Dílčí aplikace se fyzicky nachází v cestě d:/MyApp/CoolApp.
    • Žádosti se přijímají na adrese https://www.contoso.com/CoolApp/{COOLAPP RESOURCE}.

Bez zadání další konfigurace pro aplikaci CoolApp nemá v tomto scénáři dílčí aplikace žádné znalosti o tom, kde se nachází na serveru. Aplikace například nemůže vytvořit správné relativní adresy URL pro své prostředky, pokud neví, že se nachází na relativní cestě URL /CoolApp/. Tento scénář platí také v různých scénářích hostování a reverzního proxy serveru, kdy aplikace není hostovaná v kořenové cestě URL.

Pozadí

Cíl značky ukotvení (href) se dá skládat s některým ze dvou koncových bodů:

  • Absolutní umístění, která obsahují schéma (ve výchozím nastavení je schéma stránky vynecháno), hostitel, port a cesta nebo pouze lomítko (/) následované cestou.

    Příklady: https://example.com/a/b/c nebo /a/b/c

  • Relativní umístění, která obsahují pouze cestu, a nezačínejte lomítkem (/). Tyto hodnoty se překládají vzhledem k adrese URL aktuálního <base> dokumentu nebo hodnotě značky, pokud je zadána.

    Příklad: a/b/c

Přítomnost koncového lomítka (/) v nakonfigurované základní cestě aplikace je důležitá pro výpočet základní cesty pro adresy URL aplikace. Například https://example.com/a má základní cestu https://example.com/, zatímco https://example.com/a/ s koncové lomítko má základní cestu https://example.com/a.

Existují tři zdroje odkazů, které se týkají Blazor aplikací ASP.NET Core:

  • Adresy URL v Razor komponentách (.razor) jsou obvykle relativní.
  • Adresy URL ve skriptech, jako Blazor jsou skripty (blazor.*.js), jsou relativní vzhledem k dokumentu.
  • Adresy URL ručně napsané v _Host.cshtml souboru (Blazor Server), které pokud vykreslujete v různých dokumentech, by měly být vždy absolutní.
  • Adresy URL v Razor komponentách (.razor) jsou obvykle relativní.
  • Adresy URL ve skriptech, jako Blazor jsou skripty (blazor.*.js), jsou relativní vzhledem k dokumentu.

Pokud vykreslujete Blazor aplikaci z různých dokumentů (například /Admin/B/C/ a /Admin/D/E/), musíte vzít v úvahu základní cestu aplikace nebo se základní cesta liší, když se aplikace vykreslí v každém dokumentu a prostředky se načítají z nesprávných adres URL.

Existují dva přístupy ke správnému řešení problémů s řešením relativních odkazů:

  • Namapujte prostředky dynamicky pomocí dokumentu, na který byly vykresleny jako kořen.
  • Nastavte konzistentní základní cestu pro dokument a namapujte prostředky v rámci této základní cesty.

První možnost je složitější a není nejběžnějším přístupem, protože navigace se pro každý dokument liší. Při vykreslování stránky /Something/Elsezvažte následující příklad:

  • Vykresleno pod /Admin/B/C/, stránka je vykreslena s cestou ./Admin/B/C/Something/Else
  • Vykresleno pod /Admin/D/E/, stránka je vykreslena na stejné cestě/Admin/B/C/Something/Else.

V rámci prvního přístupu nabízí IDynamicEndpointMetadata směrování a MatcherPolicykteré v kombinaci mohou být základem pro implementaci zcela dynamického řešení, které určuje za běhu o způsobu směrování požadavků.

U druhé možnosti, což je obvyklý přístup, nastaví aplikace základní cestu v dokumentu a mapuje koncové body serveru na cesty pod základnou. Tento přístup přijímá následující doprovodné materiály.

Na straně serveru Blazor

Namapujte SignalR centrum aplikace na straně Blazor serveru předáním cesty k MapBlazorHub souboru Program :

app.MapBlazorHub("base/path");

Výhodou použití MapBlazorHub je, že můžete mapovat vzory, například "{tenant}" a ne jenom konkrétní cesty.

Centrum můžete také mapovat SignalR , když je aplikace ve virtuální složce s kanálem větveného middlewaru. V následujícím příkladu se požadavky /base/path/ na zpracování zpracovávají centremBlazorSignalR:

app.Map("/base/path/", subapp => {
    subapp.UsePathBase("/base/path/");
    subapp.UseRouting();
    subapp.UseEndpoints(endpoints => endpoints.MapBlazorHub());
});

<base> Nakonfigurujte značku podle pokynů v části Konfigurace základní cesty aplikace.

Hostil Blazor WebAssembly

Pokud je aplikace hostovaná Blazor WebAssembly aplikace:

  • Server V projektu (Program.cs):
    • Upravte cestu UseBlazorFrameworkFiles (například app.UseBlazorFrameworkFiles("/base/path");).
    • Nakonfigurujte volání UseStaticFiles (například app.UseStaticFiles("/base/path");).
  • Client V projektu:
    • Nakonfigurujte <StaticWebAssetBasePath> v souboru projektu tak, aby odpovídala cestě pro obsluhu statických webových prostředků (například <StaticWebAssetBasePath>base/path</StaticWebAssetBasePath> ).
    • <base> Nakonfigurujte značku podle pokynů v části Konfigurace základní cesty aplikace.

Příklad hostování více Blazor WebAssembly aplikací v hostovaném Blazor WebAssembly řešení najdete v tématu Více hostovaných aplikací ASP.NET CoreBlazor WebAssembly, kde jsou vysvětlené přístupy pro hostování domén/portů a hostování několika klientských Blazor WebAssembly aplikací.

Samostatné Blazor WebAssembly

V samostatné Blazor WebAssembly aplikaci je nakonfigurovaná pouze <base> značka podle pokynů v části Konfigurace základní cesty aplikace.

Konfigurace základní cesty aplikace

Pokud chcete poskytnout konfiguraci základní Blazor cesty https://www.contoso.com/CoolApp/aplikace , nastavte základní cestu aplikace, která se označuje také jako relativní kořenová cesta.

Když nakonfigurujete základní cestu aplikace, komponenta, která není v kořenovém adresáři, může vytvořit adresy URL vzhledem ke kořenové cestě aplikace. Komponenty na různých úrovních adresářové struktury můžou vytvářet odkazy na jiné prostředky v umístěních v rámci celé aplikace. Základní cesta aplikace se také používá k zachycení vybraných hypertextových odkazů, kde cíl odkazu href je v prostoru URI základní cesty aplikace. Komponenta Router zpracovává interní navigaci.

V mnoha scénářích hostování je relativní cesta URL aplikace kořenem aplikace. V těchto výchozích případech je / základní cesta relativní adresy URL aplikace nakonfigurovaná jako <base href="/" /> v <head> obsahu.

V mnoha scénářích hostování je relativní cesta URL aplikace kořenem aplikace. V těchto výchozích případech je základní cesta relativní adresy URL aplikace v obsahu následující<head>:

  • Blazor Server: ~/ nakonfigurováno jako <base href="~/" />.
  • Blazor WebAssembly: / nakonfigurováno jako <base href="/" />.

Poznámka:

V některých scénářích hostování, jako jsou GitHub Pages a dílčí aplikace IIS, musí být základní cesta aplikace nastavená na relativní cestu URL serveru aplikace.

  • V aplikaci na straně Blazor serveru použijte některý z následujících přístupů:

    • Možnost 1: Pomocí značky <base> nastavte základní cestu aplikace (umístění <head> obsahu):

      <base href="/CoolApp/">
      

      Koncové lomítko se vyžaduje.

    • Možnost 2: Nejprve zavolejteUsePathBase v kanálu zpracování žádostí aplikace (Program.cs) hned po sestavení WebApplicationBuilder (builder.Build()) a nakonfigurujte základní cestu pro jakýkoli následující middleware, který komunikuje s cestou požadavku:

      app.UsePathBase("/CoolApp");
      

      Volání UsePathBase se doporučuje, pokud chcete aplikaci Blazor Server spustit místně. Zadejte například adresu URL pro spuštění v souboru Properties/launchSettings.json:

      "launchUrl": "https://localhost:{PORT}/CoolApp",
      

      Zástupný symbol {PORT} v předchozím příkladu je port, který odpovídá zabezpečenému portu v cestě konfigurace applicationUrl. Následující příklad ukazuje úplný spouštěcí profil aplikace na portu 7279:

      "BlazorSample": {
        "commandName": "Project",
        "dotnetRunMessages": true,
        "launchBrowser": true,
        "applicationUrl": "https://localhost:7279;http://localhost:5279",
        "launchUrl": "https://localhost:7279/CoolApp",
        "environmentVariables": {
          "ASPNETCORE_ENVIRONMENT": "Development"
      }
      

      Další informace o launchSettings.json souboru najdete v tématu Použití více prostředí v ASP.NET Core. Další informace o Blazor základních cestách a hostování aplikací najdete v tématu <base href="/" /> nebo alternativě základní značky pro Blazor integraci MVC (dotnet/aspnetcore #43191).

  • Blazor WebAssembly Samostatný (wwwroot/index.html):

    <base href="/CoolApp/">
    

    Koncové lomítko se vyžaduje.

  • Hostované Blazor WebAssembly (Client projekt, wwwroot/index.html):

    <base href="/CoolApp/">
    

    Koncové lomítko se vyžaduje.

    Server V projektu nejprve volejte UsePathBasekanál zpracování žádostí aplikace (Program.cs) hned po sestavení WebApplicationBuilder (builder.Build()) a nakonfigurujte základní cestu pro jakýkoli následující middleware, který komunikuje s cestou požadavku:

    app.UsePathBase("/CoolApp");
    

Poznámka:

Při použití WebApplication (viz Migrace z ASP.NET Core 5.0 na 6.0), musí být volána poUsePathBase, app.UseRouting aby middleware směrování mohl sledovat upravenou cestu před odpovídajícími trasami. Jinak se trasy shodují před přepsáním cesty pomocí UsePathBase, jak je popsáno v článcích Řazení middlewaru a Směrování.

Neuvádějte odkazy v rámci aplikace znakem lomítka. Buď se vyhněte použití oddělovače segmentů cesty, nebo použijte zápis relativní cesty pomocí tečky a lomítka (./):

  • Nesprávně: <a href="/account">
  • Správné: <a href="account">
  • Správné: <a href="./account">

V požadavcích webového rozhraní API Blazor WebAssembly se službou HttpClient ověřte, že pomocné rutiny JSON (HttpClientJsonExtensions) neuvádějí adresy URL znakem lomítka (/):

  • Nesprávně: var rsp = await client.GetFromJsonAsync("/api/Account");
  • Správné: var rsp = await client.GetFromJsonAsync("api/Account");

Neuvádějte relativní odkazy Navigation Manageru znakem lomítka. Buď se vyhněte použití oddělovače segmentů cesty, nebo použijte dot-slash (./) relativní notaci cesty (Navigation je vložena NavigationManager):

  • Nesprávně: Navigation.NavigateTo("/other");
  • Správné: Navigation.NavigateTo("other");
  • Správné: Navigation.NavigateTo("./other");

V typických konfiguracích pro hostování Azure/IIS obvykle není nutná další konfigurace. V některýchscénářch

  • Správné obsluhování statických souborů (například app.UseStaticFiles("/CoolApp");).
  • Pro obsluhu Blazor skriptu (_framework/blazor.*.js). Další informace najdete v tématu Statické soubory ASP.NET Core Blazor.

V případě aplikace Blazor WebAssembly s nekořenovou relativní cestou URL (například <base href="/CoolApp/">) se aplikaci při místním spuštění nepodaří najít prostředky. Chcete-li tento problém při místním vývoji a testování překonat, můžete zadat argument základní cesty, který odpovídá hodnotě href značky <base> za běhu. Nezahrnujte koncové lomítko. Pokud chcete předat argument základní cesty při místním spuštění aplikace, spusťte příkaz dotnet run z adresáře aplikace s možností --pathbase:

dotnet run --pathbase=/{RELATIVE URL PATH (no trailing slash)}

Pro aplikaci Blazor WebAssembly s relativní cestou /CoolApp/ url (<base href="/CoolApp/">) je příkaz následující:

dotnet run --pathbase=/CoolApp

Pokud dáváte přednost konfiguraci spouštěcího profilu aplikace tak, aby určoval pathbase automaticky, a ne ručně pomocí dotnet run, nastavte vlastnost commandLineArgs v souboru Properties/launchSettings.json. Následující kód také nakonfiguruje adresu URL pro spuštění (launchUrl):

"commandLineArgs": "--pathbase=/{RELATIVE URL PATH (no trailing slash)}",
"launchUrl": "{RELATIVE URL PATH (no trailing slash)}",

Použití CoolApp jako příkladu:

"commandLineArgs": "--pathbase=/CoolApp",
"launchUrl": "CoolApp",

Když použijete dotnet run s možností --pathbase, nebo konfiguraci spouštěcího profilu, která nastaví základní cestu, aplikace Blazor WebAssembly reaguje místně na adrese http://localhost:port/CoolApp.

Další informace o launchSettings.json souboru najdete v tématu Použití více prostředí v ASP.NET Core. Další informace o Blazor základních cestách a hostování aplikací najdete v tématu <base href="/" /> nebo alternativě základní značky pro Blazor integraci MVC (dotnet/aspnetcore #43191).

Získání základní cesty aplikace z konfigurace

Následující doprovodné materiály vysvětlují, jak získat cestu ke <base> značce ze souboru nastavení aplikace pro různá prostředí.

Přidejte do aplikace soubor nastavení aplikace. Následující příklad je pro Staging prostředí (appsettings.Staging.json):

{
  "AppBasePath": "staging/"
}

V aplikaci na straně Blazor serveru načtěte základní cestu z konfigurace v <head> obsahu:

@inject IConfiguration Config

...

<head>
    ...
    <base href="/@(Config.GetValue<string>("AppBasePath"))" />
    ...
</head>

Alternativně může aplikace na straně serveru získat hodnotu z konfigurace pro UsePathBase. Nejprve umístěte následující kód do kanálu zpracování žádostí aplikace (Program.cs) hned po WebApplicationBuilder sestavení (builder.Build()). Následující příklad používá konfigurační klíč AppBasePath:

app.UsePathBase($"/{app.Configuration.GetValue<string>("AppBasePath")}");

V aplikaci na straně Blazor WebAssembly klienta:

  • <base> Odeberte značku zwwwroot/index.html:

    - <base href="..." />
    
  • Zadejte základní cestu aplikace prostřednictvím HeadContent komponenty v komponentě App (App.razor):

    @inject IConfiguration Config
    
    ...
    
    <HeadContent>
        <base href="/@(Config.GetValue<string>("AppBasePath"))" />
    </HeadContent>
    

Pokud neexistuje žádná hodnota konfigurace, která by se načetla, například v přípravných prostředích, předchozí href přeloží na kořenovou cestu /.

Příklady v této části se zaměřují na poskytování základní cesty aplikace z nastavení aplikace, ale přístup ke čtení cesty z IConfiguration tohoto umístění je platný pro libovolného zprostředkovatele konfigurace. Další informace naleznete v následujících zdrojích:

Konfigurace Blazor ServerMapFallbackToPage

Tato část platí jenom pro Blazor Server aplikace. MapFallbackToPageaplikace a Blazor WebAssembly webové aplikace se nepodporujíBlazor.

Ve scénářích, kdy aplikace vyžaduje samostatnou oblast s vlastními prostředky a komponentami Razor:

  • Vytvořte složku ve složce aplikace Pages pro uložení prostředků. Například oddíl správce aplikace se vytvoří v nové složce s názvem Admin (Pages/Admin).

  • Vytvořte pro oblast kořenovou stránku (_Host.cshtml). Můžete například vytvořit soubor Pages/Admin/_Host.cshtml z hlavní kořenové stránky aplikace (Pages/_Host.cshtml). Nezadávejte direktivu @page na stránce _Host správce.

  • Přidejte rozložení do složky oblasti (například Pages/Admin/_Layout.razor). V rozložení pro samostatnou oblast nastavte značku <base>href tak, aby odpovídala složce oblasti (například <base href="/Admin/" />). Pro demonstrační účely ke statickým prostředkům na stránce přidejte ~/. Příklad:

    • ~/css/bootstrap/bootstrap.min.css
    • ~/css/site.css
    • ~/BlazorSample.styles.css (obor názvů ukázkové aplikace je BlazorSample)
    • ~/_framework/blazor.server.js (skript Blazor)
  • Pokud má mít oblast vlastní složku statických prostředků, přidejte složku a zadejte její umístění do middlewaru Static File v souboru Program.cs (například app.UseStaticFiles("/Admin/wwwroot")).

  • Komponenty Razor se přidají do složky oblasti. Přidejte minimálně komponentu Index do složky oblasti se správnou direktivou @page pro danou oblast. Přidejte například soubor Pages/Admin/Index.razor založený na výchozím souboru aplikace Pages/Index.razor. V horní části souboru označte oblast správce jako šablonu trasy (@page "/admin"). Podle potřeby přidejte další komponenty. Například Pages/Admin/Component1.razor s direktivou @page a šablonou trasy @page "/admin/component1.

  • V souboru Program.cs volejte MapFallbackToPage pro cestu žádosti oblasti bezprostředně před záložní kořenovou cestou stránky _Host:

    ...
    app.UseRouting();
    
    app.MapBlazorHub();
    app.MapFallbackToPage("~/Admin/{*clientroutes:nonfile}", "/Admin/_Host");
    app.MapFallbackToPage("/_Host");
    
    app.Run();
    

Hostování více aplikací Blazor WebAssembly

Další informace o hostování více aplikací Blazor WebAssembly v hostovaném Blazorřešení najdete v tématu Více hostovaných aplikací ASP.NET Core Blazor WebAssembly.

Nasazení

Pokyny k nasazení najdete v následujících tématech: