Hostowanie i wdrażanie platformy ASP.NET Core Blazor

W tym artykule wyjaśniono, jak hostować i wdrażać aplikacje Blazor.

Opublikuj aplikację

Aplikacje są publikowane na potrzeby wdrażania w konfiguracji wydania.

Program Visual Studio

1. Wybierz polecenie Publikuj aplikację {APPLICATION} z menu Kompilacja , gdzie {APPLICATION} symbol zastępczy nazwy aplikacji.
2. Wybierz element docelowy publikowania. Aby opublikować lokalnie, wybierz pozycję Folder. Wybierz Dalej.
3. Podczas publikowania lokalnego zaakceptuj domyślną lokalizację folderu lub określ inną lokalizację. Wybierz pozycję Zakończ , aby zapisać profil. Wybierz Zamknij.
4. Aby wyczyścić folder publikowania elementu docelowego przed opublikowaniem aplikacji, wybierz pozycję Pokaż wszystkie ustawienia. Wybierz pozycję Ustawienia> Opcje >Usuń wszystkie istniejące pliki przed opublikowaniem. Wybierz Zapisz.
5. Wybierz przycisk Publikuj.

Visual Studio Code i .NET CLI

Otwórz powłokę poleceń w katalogu głównym projektu.

Użyj polecenia , dotnet publish aby opublikować aplikację:

dotnet publish

Przed programem .NET 8 domyślną konfiguracją publikowania jest Debug. Podczas publikowania aplikacji przeznaczonej dla platformy .NET 7 lub starszej wersji, przekaż opcję -c|--configuration do polecenia "Release", aby opublikować w konfiguracji Release.

dotnet publish -c Release

Opublikowanie aplikacji wyzwala przywrócenie zależności projektu i skompilowanie projektu przed utworzeniem zasobów na potrzeby wdrożenia. W ramach procesu kompilowania usuwane są nieużywane metody i zestawy, aby zmniejszyć rozmiar pakietu do pobrania i czas ładowania aplikacji.

Opróżnij docelowy folder publikowania

W przypadku używania dotnet publish polecenia w powłoce poleceń do publikowania aplikacji polecenie generuje niezbędne pliki do wdrożenia na podstawie bieżącego stanu projektu i umieszcza pliki w określonym folderze wyjściowym. Polecenie nie czyści automatycznie folderu docelowego przed opublikowaniem aplikacji.

Aby automatycznie opróżnić folder docelowy przed opublikowaniem aplikacji, dodaj następujący element docelowy MSBuild do pliku projektu aplikacji (.csproj) w elemecie głównym <Project> :

<Target Name="_RemovePublishDirBeforePublishing" BeforeTargets="BeforePublish">
  <RemoveDir Directories="$(PublishDir)" Condition="'$(PublishDir)' != ''" />
</Target>

Domyślne lokalizacje publikowania

• Blazor Web App: aplikacja jest publikowana w folderze /bin/Release/{TARGET FRAMEWORK}/publish, gdzie symbol zastępczy {TARGET FRAMEWORK} oznacza docelowe środowisko programistyczne. Wdróż zawartość folderu publish na hoście.
• Blazor WebAssembly: Autonomiczny: Aplikacja jest publikowana do folderu bin/Release/{TARGET FRAMEWORK}/publish lub bin/Release/{TARGET FRAMEWORK}/browser-wasm/publish. Aby wdrożyć aplikację jako witrynę statyczną, skopiuj zawartość folderu wwwroot do hosta witryny statycznej.

IIS

Aby hostować aplikację Blazor w usługach IIS, zobacz następujące zasoby:

• Hosting usług IIS
  • Publikowanie aplikacji ASP.NET Core w usługach IIS
  • Hostowanie aplikacji ASP.NET Core w systemie Windows przy użyciu usług IIS
• Hostowanie i wdrażanie aplikacji po stronie Blazor serwera ASP.NET Core: Blazor Web Apps (.NET 8 lub nowszy) i Blazor Server aplikacji (.NET 7 lub starszych) uruchomionych w usługach IIS, w tym usług IIS z maszynami wirtualnymi platformy Azure z systemem operacyjnym Windows i usługą Azure App Service.
• Hostowanie i wdrażanie ASP.NET Core Blazor WebAssembly za pomocą usług IIS: Blazor WebAssembly autonomiczne aplikacje (wszystkie wersje platformy .NET) i hostowane Blazor WebAssembly aplikacje (.NET 7 lub starsze).
• Hostowanie podapliki usług IIS
  • Postępuj zgodnie ze wskazówkami dotyczącymi ścieżki podstawowej aplikacji przed opublikowaniem aplikacji. W przykładach użyto ścieżki /CoolApp podstawowej aplikacji i pokazano, jak uzyskać ścieżkę podstawową z ustawień aplikacji lub innych dostawców konfiguracji.
  • Postępuj zgodnie ze wskazówkami dotyczącymi konfiguracji podrzędnej aplikacji w sekcji Konfiguracja zaawansowana. Ścieżka folderu podapliki w witrynie głównej staje się ścieżką wirtualną podapliki. W przypadku ścieżki bazowej aplikacji /CoolApp, aplikacja Blazor jest umieszczana w folderze o nazwie CoolApp w witrynie głównej, a podaplikacja przyjmuje wirtualną ścieżkę /CoolApp.

Udostępnianie puli aplikacji między aplikacjami ASP.NET Core nie jest obsługiwane, w tym w przypadku aplikacji Blazor. Używaj jednej puli aplikacji na aplikację w przypadku hostingu z usługami IIS i unikaj używania katalogów wirtualnych usług IIS do hostowania wielu aplikacji.

Obsługa bundlera JavaScript

Środowisko Blazor uruchomieniowe opiera się na plikach JavaScript (JS), środowisku uruchomieniowym platformy .NET skompilowanym w kodzie WebAssembly i zarządzanych zestawach spakowanych jako pliki WebAssembly. Gdy aplikacja Blazor jest budowana, środowisko uruchomieniowe Blazor zależy od tych plików z różnych miejsc kompilacji. Ze względu na to ograniczenie wyniki budowania Blazor nie są zgodne z narzędziami pakietującymi JS, takimi jak Gulp, Webpack i Rollup.

Aby utworzyć dane wyjściowe kompilacji zgodne z JS pakietami podczas publikowania, ustaw WasmBundlerFriendlyBootConfig właściwość MSBuild na true w pliku projektu aplikacji:

<WasmBundlerFriendlyBootConfig>true</WasmBundlerFriendlyBootConfig>

Ważne

Ta funkcja generuje wyłącznie dane wynikowe przyjazne dla narzędzia do tworzenia pakietów podczas publikowania aplikacji.

Dane wyjściowe nie są bezpośrednio uruchamiane w przeglądarce, ale mogą być przetworzone przez narzędzia JS do łączenia JS plików z pozostałymi skryptami dostarczonymi przez dewelopera.

Po włączeniu WasmBundlerFriendlyBootConfig, generowany JS zawiera dyrektywy import dla wszystkich zasobów w aplikacji, co sprawia, że zależności są widoczne dla pakietera. Wiele zasobów nie można załadować przez przeglądarkę, ale pakiety zwykle można skonfigurować do rozpoznawania zasobów według typu pliku w celu obsługi ładowania. Aby uzyskać szczegółowe informacje na temat konfigurowania pakietu, zapoznaj się z dokumentacją pakietu.

Uwaga

Pakietowanie wyników kompilacji powinno być możliwe przez przypisanie importów do odpowiednich lokalizacji plików przy użyciu niestandardowej wtyczki bundlera. W tej chwili nie udostępniamy takiej wtyczki.

Uwaga

Zastąpienie wtyczki files pluginem url powoduje, że wszystkie pliki aplikacji JS, w tym środowisko uruchomieniowe WebAssembly (zakodowane w base64 w elemencie Blazor), są dołączone do wynikowego pliku. Rozmiar pliku jest znacząco większy (na przykład o 300%) niż wtedy, gdy pliki są zarządzane przy użyciu wtyczki files, dlatego nie zalecamy używania wtyczki url jako standardowej praktyki podczas tworzenia wyjściowych plików przyjaznych dla procesu przetwarzania JS pakietów.

Następujące przykładowe aplikacje są oparte na Rollup. Podobne pojęcia mają zastosowanie podczas korzystania z innych JS pakietów.

Przykładowe aplikacje dla Blazor WebAssembly aplikacji React (BlazorWebAssemblyReact) i platformy .NET w zestawie WebAssembly w aplikacji React (DotNetWebAssemblyReact) dla platformy .NET 10 lub nowszej są dostępne w Blazor repozytorium GitHub przykładów (dotnet/blazor-samples).

Aspekty buforowania Blazor WebAssembly mają zastosowanie do Blazor Web Appów

Blazor Wskazówki dotyczące buforowania pakietów i buforowania HTTP w węźle Blazor WebAssembly koncentrują się na autonomicznych aplikacjach, ale kilka aspektów buforowania po stronie klienta w tych artykułach odnosi się również do aplikacji, które wykorzystują tryby renderowania Interactive WebAssembly lub Interactive Auto. Jeśli komponent Blazor Web App odpowiedzialny za renderowanie zawartości po stronie klienta natrafi na problem z buforowaniem statycznych zasobów lub pakietów, skorzystaj z wytycznych zawartych w tych artykułach, aby rozwiązać problem.

• ASP.NET Podstawowe Blazor WebAssembly błędy buforowania i sprawdzania integralności
• Unikaj problemów z buforowaniem HTTP podczas uaktualniania aplikacji ASP.NET Core Blazor

Konfiguracja Blazor ServerMapFallbackToPage

Ta sekcja dotyczy tylko aplikacji Blazor Server. MapFallbackToPage nie jest obsługiwany w aplikacjach Blazor Web App oraz w aplikacjach Blazor WebAssembly.

W scenariuszach, w których aplikacja wymaga oddzielnego obszaru z zasobami niestandardowymi i składnikami Razor:

• Utwórz folder w folderze Pages aplikacji do przechowywania zasobów. Na przykład jest tworzona sekcja administratora aplikacji w nowym folderze o nazwie Admin (Pages/Admin).

• Utwórz stronę główną (_Host.cshtml) dla tego obszaru. Na przykład, utwórz plik Pages/Admin/_Host.cshtml na głównej stronie katalogu aplikacji (Pages/_Host.cshtml). Nie podawaj dyrektywy @page na stronie _Host administratora.

• Dodaj układ do folderu danego obszaru (na przykład Pages/Admin/_Layout.razor). W układzie dla oddzielnego obszaru dopasuj tagi <base>href do folderu obszaru (na przykład <base href="/Admin/" />). W celach demonstracyjnych dodaj ~/ do zasobów statycznych na stronie. Na przykład:

  • ~/css/bootstrap/bootstrap.min.css
  • ~/css/site.css
  • ~/BlazorSample.styles.css (przestrzeń nazw przykładowej aplikacji to BlazorSample)
  • ~/_framework/blazor.server.js (skrypt Blazor)

• Jeśli obszar powinien mieć własny folder zasobów statycznych, dodaj folder i określ jego lokalizację dla oprogramowania pośredniczącego plików statycznych w pliku Program.cs (na przykład app.UseStaticFiles("/Admin/wwwroot")).

• Do folderu obszaru zostaną dodane komponenty Razor. Dodaj co najmniej składnik Index do folderu obszaru z właściwą dyrektywą @page dla tego obszaru. Na przykład dodaj plik Pages/Admin/Index.razor na podstawie domyślnego pliku Pages/Index.razor aplikacji. Wskaż obszar administratora jako szablon trasy w górnej części pliku (@page "/admin"). Dodawać dodatkowe składniki w razie potrzeby. Na przykład Pages/Admin/Component1.razor z dyrektywą @page i szablonem trasy @page "/admin/component1.

• W Program.cs wywołaj MapFallbackToPage dla ścieżki żądania obszaru, tuż przed ścieżką rezerwową do strony katalogu głównego, do strony _Host:

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