Share via

struktura projektu ASP.NET Core Blazor

  • Artykuł

Uwaga

Nie jest to najnowsza wersja tego artykułu. Aby zapoznać się z bieżącą wersją, zapoznaj się z wersją tego artykułu platformy .NET 8.

Ważne

Te informacje odnoszą się do produktu w wersji wstępnej, który może zostać znacząco zmodyfikowany, zanim zostanie wydany komercyjnie. Firma Microsoft nie udziela żadnych gwarancji, jawnych lub domniemanych, w odniesieniu do informacji podanych w tym miejscu.

Aby zapoznać się z bieżącą wersją, zapoznaj się z wersją tego artykułu platformy .NET 8.

W tym artykule opisano pliki i foldery tworzące aplikację Blazor wygenerowaną Blazor na podstawie szablonu projektu.

Blazor Aplikacja internetowa

Blazor Szablon projektu aplikacji internetowej: blazor

Szablon Blazor projektu aplikacji internetowej zapewnia pojedynczy punkt wyjścia do tworzenia Razor dowolnego stylu internetowego interfejsu użytkownika, renderowanego po stronie serwera i renderowanego po stronie klienta. Łączy ona mocne strony istniejących Blazor Server i Blazor WebAssembly hostowania modeli z renderowaniem po stronie serwera, renderowaniem strumieniowym, rozszerzoną nawigacją i obsługą formularzy oraz możliwość dodawania interakcyjności przy użyciu Blazor Server metody lub Blazor WebAssembly na podstawie poszczególnych składników.

Jeśli podczas tworzenia aplikacji wybrano renderowanie po stronie klienta (CSR) i interaktywne renderowanie po stronie serwera (interakcyjne SSR), szablon projektu używa trybu renderowania interakcyjnego. Tryb automatycznego renderowania początkowo używa interakcyjnego przewodnika SSR, podczas gdy pakiet aplikacji platformy .NET i środowisko uruchomieniowe są pobierane do przeglądarki. Po aktywowaniu środowiska uruchomieniowego zestawu WebAssembly platformy .NET renderowanie przełącza się na csr.

Domyślnie Blazor szablon aplikacji internetowej umożliwia renderowanie statyczne i interaktywne po stronie serwera przy użyciu jednego projektu. Jeśli włączysz również renderowanie interactive WebAssembly, projekt zawiera dodatkowy projekt klienta (.Client) dla składników opartych na zestawie WebAssembly. Skompilowane dane wyjściowe z projektu klienta są pobierane do przeglądarki i wykonywane na kliencie. Składniki korzystające z interakcyjnych trybów renderowania WebAssembly lub Interactive Auto muszą znajdować się w projekcie .Client .

Aby uzyskać więcej informacji, zobacz tryby renderowania ASP.NET CoreBlazor.

  • Projekt serwera:

    • Components Folder:

      • Layout folder: zawiera następujące składniki układu i arkusze stylów:

        • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
        • MainLayout.razor.css: arkusz stylów dla głównego układu aplikacji.
        • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink wskazuje użytkownikowi, który składnik jest aktualnie wyświetlany.
        • NavMenu.razor.css: arkusz stylów dla menu nawigacji aplikacji.

      • Pages folder: zawiera składniki po stronie Razor serwera (.razor). Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące elementy:

        • Counter component (Counter.razor): implementuje stronę Licznik .
        • Error component (Error.razor): implementuje stronę Błąd .
        • Home component (Home.razor): implementuje Home stronę.
        • Weather component (Weather.razor): implementuje stronę Prognoza pogody .

      • App component (App.razor): składnik główny aplikacji ze znacznikiem HTML <head> , składnikiem Routes i tagiem Blazor<script> . Składnik główny jest pierwszym składnikiem ładowany przez aplikację.

      • Routes component (Routes.razor): konfiguruje routing przy użyciu Router składnika. W przypadku składników Router interaktywnych po stronie klienta składnik przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

      • _Imports.razor: zawiera typowe Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji renderowanych przez serwer (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

    • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

      Uwaga

      Profil http poprzedza https profil w launchSettings.json pliku . Po uruchomieniu aplikacji przy użyciu interfejsu wiersza polecenia platformy .NET aplikacja jest uruchamiana w punkcie końcowym HTTP, ponieważ pierwszy znaleziony profil to http. Kolejność profilów ułatwia przejście wdrażania protokołu HTTPS dla użytkowników systemów Linux i macOS. Jeśli wolisz uruchomić aplikację przy użyciu interfejsu wiersza polecenia platformy .NET bez konieczności przekazywania -lp https polecenia lub --launch-profile https do dotnet run polecenia, po prostu umieść https profil nad profilem http w pliku.

    • wwwroot folder: folder główny sieci Web dla projektu serwera zawierający publiczne zasoby statyczne aplikacji.

    • Program.csplik: punkt wejścia projektu serwera, który konfiguruje hosta aplikacji internetowej ASP.NET Core i zawiera logikę uruchamiania aplikacji, w tym rejestracje usług, konfigurację, rejestrowanie i potok przetwarzania żądań.

    • Pliki ustawień aplikacji (appsettings.Development.json, appsettings.json): podaj ustawienia konfiguracji dla projektu serwera.

  • Projekt klienta (.Client):

    • Pages folder: zawiera składniki po stronie Razor klienta (.razor). Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera Counter składnik (Counter.razor), który implementuje stronę Licznik .

      Struktura folderów składników .Client projektu różni się od Blazor głównej struktury folderów projektu aplikacji internetowej, ponieważ głównym projektem jest standardowy projekt ASP.NET Core. Główny projekt musi uwzględniać inne zasoby dla projektów ASP.NET Core, które nie są powiązane z Blazor.

      Projekt .Client jest wyłącznie Blazor projektem i nie jest wymagany do integracji tak samo z funkcjamiBlazor i specyfikacjami ASP.NET Core, więc używa mniej złożonej struktury folderów składników. Możesz jednak użyć dowolnej struktury folderów składników, której chcesz użyć w projekcie .Client . Jeśli chcesz, możesz dublować układ folderu składnika głównego projektu w projekcie .Client . Należy pamiętać, że przestrzenie nazw mogą wymagać korekt dla takich zasobów, jak pliki układu, jeśli przenosisz składniki do różnych folderów niż szablon projektu.

    • Folder główny sieci Web dla projektu po stronie klienta zawierający publiczne zasoby statyczne aplikacji, w tym pliki ustawień aplikacji (appsettings.Development.json, appsettings.json), które zapewniają ustawienia konfiguracji projektu po stronie klienta.

    • Program.csplik: punkt wejścia projektu po stronie klienta, który konfiguruje hosta zestawu WebAssembly i zawiera logikę uruchamiania projektu, w tym rejestracje usług, konfigurację, rejestrowanie i potok przetwarzania żądań.

    • _Imports.razor: zawiera typowe Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji renderowanych przez zestaw WebAssembly (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej Blazor na podstawie szablonu projektu aplikacji internetowej po skonfigurowaniu dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Blazor Server

Blazor Server szablony projektów: blazorserver, blazorserver-empty

Szablony Blazor Server tworzą początkowe pliki i strukturę katalogów dla Blazor Server aplikacji:

  • blazorserver Jeśli szablon jest używany, aplikacja zostanie wypełniona następującymi elementami:
    • Kod demonstracyjny dla FetchData składnika, który ładuje dane z usługi prognozy pogody (WeatherForecastService) i interakcji użytkownika ze składnikiem Counter .
    • Zestaw narzędzi frontonu bootstrap .
  • blazorserver-empty Jeśli szablon jest używany, aplikacja jest tworzona bez demonstracyjnego kodu i bootstrap.

Struktura projektu:

  • Data folder: zawiera klasę WeatherForecast i implementację WeatherForecastService elementu , która dostarcza przykładowe dane pogodowe do składnika aplikacji FetchData .

  • Pagesfolder: zawiera Blazor składniki routingu Razor aplikacji (.razor) i stronę Blazor Server główną Razor aplikacji. Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące elementy:

    • _Host.cshtml: strona główna aplikacji zaimplementowana jako Razor strona:
      • Gdy każda strona aplikacji jest początkowo żądana, ta strona jest renderowana i zwracana w odpowiedzi.
      • Strona Host określa, gdzie jest renderowany składnik główny App (App.razor).
    • Counter component (Counter.razor): implementuje stronę Licznik.
    • Error component (Error.razor): Renderowane, gdy w aplikacji wystąpi nieobsługiwany wyjątek.
    • FetchData component (FetchData.razor): implementuje stronę Pobierania danych.
    • Index component (Index.razor): implementuje Home stronę.

  • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

  • Shared folder: zawiera następujące składniki udostępnione i arkusze stylów:

    • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
    • MainLayout.razor.css: arkusz stylów dla głównego układu aplikacji.
    • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink automatycznie wskazuje wybrany stan po załadowaniu składnika, co pomaga użytkownikowi zrozumieć, który składnik jest aktualnie wyświetlany.
    • NavMenu.razor.css: arkusz stylów dla menu nawigacji aplikacji.
    • SurveyPrompt składnik (SurveyPrompt.razor): Blazor składnik ankiety.

  • wwwroot folder: folder główny sieci Web dla aplikacji zawierającej publiczne zasoby statyczne aplikacji.

  • _Imports.razor: zawiera wspólne Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

  • App.razor: składnik główny aplikacji, który konfiguruje routing po stronie klienta przy użyciu Router składnika. Składnik Router przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

  • appsettings.json i pliki ustawień aplikacji środowiskowych: podaj ustawienia konfiguracji aplikacji.

  • Program.cs: punkt wejścia aplikacji, który konfiguruje hosta ASP.NET Core i zawiera logikę uruchamiania aplikacji, w tym rejestracje usługi i konfigurację potoku przetwarzania żądań:

    • Określa usługi wstrzykiwania zależności aplikacji (DI). Usługi są dodawane przez wywołanie AddServerSideBlazormetody , a WeatherForecastService element jest dodawany do kontenera usługi do użycia przez przykładowy FetchData składnik.
    • Konfiguruje potok obsługi żądań aplikacji:
      • MapBlazorHub Jest wywoływana w celu skonfigurowania punktu końcowego dla połączenia w czasie rzeczywistym z przeglądarką. Połączenie jest tworzone za pomocą SignalRpolecenia , która jest strukturą umożliwiającą dodawanie funkcji internetowych w czasie rzeczywistym do aplikacji.
      • MapFallbackToPage("/_Host") Jest wywoływana w celu skonfigurowania strony głównej aplikacji (Pages/_Host.cshtml) i włączenia nawigacji.

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej na podstawie szablonu projektu po skonfigurowaniu Blazor Server dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Blazor Server szablon projektu: blazorserver

Szablon Blazor Server tworzy początkowe pliki i strukturę katalogów dla Blazor Server aplikacji. Aplikacja jest wypełniana kodem demonstracyjnym FetchData składnika, który ładuje dane z zarejestrowanej usługi, WeatherForecastServiceoraz interakcję użytkownika ze składnikiem Counter .

  • Data folder: zawiera klasę WeatherForecast i implementację WeatherForecastService elementu , która dostarcza przykładowe dane pogodowe do składnika aplikacji FetchData .

  • Pagesfolder: zawiera Blazor składniki routingu Razor aplikacji (.razor) i stronę Blazor Server główną Razor aplikacji. Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące elementy:

    • _Host.cshtml: strona główna aplikacji zaimplementowana jako Razor strona:
      • Gdy każda strona aplikacji jest początkowo żądana, ta strona jest renderowana i zwracana w odpowiedzi.
      • Strona Host określa, gdzie jest renderowany składnik główny App (App.razor).
    • _Layout.cshtml: strona układu strony głównej _Host.cshtml aplikacji.
    • Counter component (Counter.razor): implementuje stronę Licznik.
    • Error component (Error.razor): Renderowane, gdy w aplikacji wystąpi nieobsługiwany wyjątek.
    • FetchData component (FetchData.razor): implementuje stronę Pobierania danych.
    • Index component (Index.razor): implementuje Home stronę.

  • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

  • Shared folder: zawiera następujące składniki udostępnione i arkusze stylów:

    • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
    • MainLayout.razor.css: arkusz stylów dla głównego układu aplikacji.
    • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink automatycznie wskazuje wybrany stan po załadowaniu składnika, co pomaga użytkownikowi zrozumieć, który składnik jest aktualnie wyświetlany.
    • NavMenu.razor.css: arkusz stylów dla menu nawigacji aplikacji.
    • SurveyPrompt składnik (SurveyPrompt.razor): Blazor składnik ankiety.

  • wwwroot folder: folder główny sieci Web dla aplikacji zawierającej publiczne zasoby statyczne aplikacji.

  • _Imports.razor: zawiera wspólne Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

  • App.razor: składnik główny aplikacji, który konfiguruje routing po stronie klienta przy użyciu Router składnika. Składnik Router przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

  • appsettings.json i pliki ustawień aplikacji środowiskowych: podaj ustawienia konfiguracji aplikacji.

  • Program.cs: punkt wejścia aplikacji, który konfiguruje hosta ASP.NET Core i zawiera logikę uruchamiania aplikacji, w tym rejestracje usługi i konfigurację potoku przetwarzania żądań:

    • Określa usługi wstrzykiwania zależności aplikacji (DI). Usługi są dodawane przez wywołanie AddServerSideBlazormetody , a WeatherForecastService element jest dodawany do kontenera usługi do użycia przez przykładowy FetchData składnik.
    • Konfiguruje potok obsługi żądań aplikacji:
      • MapBlazorHub Jest wywoływana w celu skonfigurowania punktu końcowego dla połączenia w czasie rzeczywistym z przeglądarką. Połączenie jest tworzone za pomocą SignalRpolecenia , która jest strukturą umożliwiającą dodawanie funkcji internetowych w czasie rzeczywistym do aplikacji.
      • MapFallbackToPage("/_Host") Jest wywoływana w celu skonfigurowania strony głównej aplikacji (Pages/_Host.cshtml) i włączenia nawigacji.

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej na podstawie szablonu projektu po skonfigurowaniu Blazor Server dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Blazor Server szablon projektu: blazorserver

Szablon Blazor Server tworzy początkowe pliki i strukturę katalogów dla Blazor Server aplikacji. Aplikacja jest wypełniana kodem demonstracyjnym FetchData składnika, który ładuje dane z zarejestrowanej usługi, WeatherForecastServiceoraz interakcję użytkownika ze składnikiem Counter .

  • Data folder: zawiera klasę WeatherForecast i implementację WeatherForecastService elementu , która dostarcza przykładowe dane pogodowe do składnika aplikacji FetchData .

  • Pagesfolder: zawiera Blazor składniki routingu Razor aplikacji (.razor) i stronę Blazor Server główną Razor aplikacji. Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące elementy:

    • _Host.cshtml: strona główna aplikacji zaimplementowana jako Razor strona:
      • Gdy każda strona aplikacji jest początkowo żądana, ta strona jest renderowana i zwracana w odpowiedzi.
      • Strona Host określa, gdzie jest renderowany składnik główny App (App.razor).
    • Counter component (Counter.razor): implementuje stronę Licznik.
    • Error component (Error.razor): Renderowane, gdy w aplikacji wystąpi nieobsługiwany wyjątek.
    • FetchData component (FetchData.razor): implementuje stronę Pobierania danych.
    • Index component (Index.razor): implementuje Home stronę.

  • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

  • Shared folder: zawiera następujące składniki udostępnione i arkusze stylów:

    • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
    • MainLayout.razor.css: arkusz stylów dla głównego układu aplikacji.
    • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink automatycznie wskazuje wybrany stan po załadowaniu składnika, co pomaga użytkownikowi zrozumieć, który składnik jest aktualnie wyświetlany.
    • NavMenu.razor.css: arkusz stylów dla menu nawigacji aplikacji.
    • SurveyPrompt składnik (SurveyPrompt.razor): Blazor składnik ankiety.

  • wwwroot folder: folder główny sieci Web dla aplikacji zawierającej publiczne zasoby statyczne aplikacji.

  • _Imports.razor: zawiera wspólne Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

  • App.razor: składnik główny aplikacji, który konfiguruje routing po stronie klienta przy użyciu Router składnika. Składnik Router przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

  • appsettings.json i pliki ustawień aplikacji środowiskowych: podaj ustawienia konfiguracji aplikacji.

  • Program.cs: punkt wejścia aplikacji, który konfiguruje hosta ASP.NET Core.

  • Startup.cs: zawiera logikę uruchamiania aplikacji. Klasa Startup definiuje dwie metody:

    • ConfigureServices: konfiguruje usługi wstrzykiwania zależności (DI) aplikacji. Usługi są dodawane przez wywołanie AddServerSideBlazormetody , a WeatherForecastService element jest dodawany do kontenera usługi do użycia przez przykładowy FetchData składnik.
    • Configure: Konfiguruje potok obsługi żądań aplikacji:
      • MapBlazorHub Jest wywoływana w celu skonfigurowania punktu końcowego dla połączenia w czasie rzeczywistym z przeglądarką. Połączenie jest tworzone za pomocą SignalRpolecenia , która jest strukturą umożliwiającą dodawanie funkcji internetowych w czasie rzeczywistym do aplikacji.
      • MapFallbackToPage("/_Host") Jest wywoływana w celu skonfigurowania strony głównej aplikacji (Pages/_Host.cshtml) i włączenia nawigacji.

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej na podstawie szablonu projektu po skonfigurowaniu Blazor Server dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Blazor Server szablon projektu: blazorserver

Szablon Blazor Server tworzy początkowe pliki i strukturę katalogów dla Blazor Server aplikacji. Aplikacja jest wypełniana kodem demonstracyjnym FetchData składnika, który ładuje dane z zarejestrowanej usługi, WeatherForecastServiceoraz interakcję użytkownika ze składnikiem Counter .

  • Data folder: zawiera klasę WeatherForecast i implementację WeatherForecastService elementu , która dostarcza przykładowe dane pogodowe do składnika aplikacji FetchData .

  • Pagesfolder: zawiera Blazor składniki routingu Razor aplikacji (.razor) i stronę Blazor Server główną Razor aplikacji. Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące elementy:

    • _Host.cshtml: strona główna aplikacji zaimplementowana jako Razor strona:
      • Gdy każda strona aplikacji jest początkowo żądana, ta strona jest renderowana i zwracana w odpowiedzi.
      • Strona Host określa, gdzie jest renderowany składnik główny App (App.razor).
    • Counter component (Counter.razor): implementuje stronę Licznik.
    • Error component (Error.razor): Renderowane, gdy w aplikacji wystąpi nieobsługiwany wyjątek.
    • FetchData component (FetchData.razor): implementuje stronę Pobierania danych.
    • Index component (Index.razor): implementuje Home stronę.

  • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

  • Shared folder: zawiera następujące składniki udostępnione:

    • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
    • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink automatycznie wskazuje wybrany stan po załadowaniu składnika, co pomaga użytkownikowi zrozumieć, który składnik jest aktualnie wyświetlany.
    • SurveyPrompt składnik (SurveyPrompt.razor): Blazor składnik ankiety.

  • wwwroot folder: folder główny sieci Web dla aplikacji zawierającej publiczne zasoby statyczne aplikacji.

  • _Imports.razor: zawiera wspólne Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

  • App.razor: składnik główny aplikacji, który konfiguruje routing po stronie klienta przy użyciu Router składnika. Składnik Router przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

  • appsettings.json i pliki ustawień aplikacji środowiskowych: podaj ustawienia konfiguracji aplikacji.

  • Program.cs: punkt wejścia aplikacji, który konfiguruje hosta ASP.NET Core.

  • Startup.cs: zawiera logikę uruchamiania aplikacji. Klasa Startup definiuje dwie metody:

    • ConfigureServices: konfiguruje usługi wstrzykiwania zależności (DI) aplikacji. Usługi są dodawane przez wywołanie AddServerSideBlazormetody , a WeatherForecastService element jest dodawany do kontenera usługi do użycia przez przykładowy FetchData składnik.
    • Configure: Konfiguruje potok obsługi żądań aplikacji:
      • MapBlazorHub Jest wywoływana w celu skonfigurowania punktu końcowego dla połączenia w czasie rzeczywistym z przeglądarką. Połączenie jest tworzone za pomocą SignalRpolecenia , która jest strukturą umożliwiającą dodawanie funkcji internetowych w czasie rzeczywistym do aplikacji.
      • MapFallbackToPage("/_Host") Jest wywoływana w celu skonfigurowania strony głównej aplikacji (Pages/_Host.cshtml) i włączenia nawigacji.

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej na podstawie szablonu projektu po skonfigurowaniu Blazor Server dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Autonomiczny Blazor WebAssembly

Blazor WebAssembly Autonomiczny szablon projektu:blazorwasm

Szablon Blazor WebAssembly tworzy początkowe pliki i strukturę katalogów dla aplikacji autonomicznej Blazor WebAssembly :

  • blazorwasm Jeśli szablon jest używany, aplikacja zostanie wypełniona następującymi elementami:
    • Kod demonstracyjny dla Weather składnika, który ładuje dane ze statycznego zasobu (weather.json) i interakcji użytkownika ze składnikiem Counter .
    • Zestaw narzędzi frontonu bootstrap .
  • Szablon blazorwasm można również wygenerować bez przykładowych stron i stylów.

Struktura projektu:

  • Layout folder: zawiera następujące składniki układu i arkusze stylów:

    • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
    • MainLayout.razor.css: arkusz stylów dla głównego układu aplikacji.
    • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink automatycznie wskazuje wybrany stan po załadowaniu składnika, co pomaga użytkownikowi zrozumieć, który składnik jest aktualnie wyświetlany.
    • NavMenu.razor.css: arkusz stylów dla menu nawigacji aplikacji.

  • Pages folder: zawiera składniki routingu BlazorRazor aplikacji (.razor). Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące składniki:

    • Counter component (Counter.razor): implementuje stronę Licznik.
    • Index component (Index.razor): implementuje Home stronę.
    • Weather component (Weather.razor): implementuje stronę Pogoda.

  • _Imports.razor: zawiera wspólne Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

  • App.razor: składnik główny aplikacji, który konfiguruje routing po stronie klienta przy użyciu Router składnika. Składnik Router przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

  • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

    Uwaga

    Profil http poprzedza https profil w launchSettings.json pliku . Po uruchomieniu aplikacji przy użyciu interfejsu wiersza polecenia platformy .NET aplikacja jest uruchamiana w punkcie końcowym HTTP, ponieważ pierwszy znaleziony profil to http. Kolejność profilów ułatwia przejście wdrażania protokołu HTTPS dla użytkowników systemów Linux i macOS. Jeśli wolisz uruchomić aplikację przy użyciu interfejsu wiersza polecenia platformy .NET bez konieczności przekazywania -lp https polecenia lub --launch-profile https do dotnet run polecenia, po prostu umieść https profil nad profilem http w pliku.

  • wwwroot folder: folder główny sieci Web dla aplikacji zawierający publiczne zasoby statyczne aplikacji, w tym appsettings.json pliki ustawień aplikacji środowiskowych dla ustawień konfiguracji i przykładowych danych pogodowych (sample-data/weather.json). Strona index.html internetowa to strona główna aplikacji zaimplementowana jako strona HTML:

    • Gdy każda strona aplikacji jest początkowo żądana, ta strona jest renderowana i zwracana w odpowiedzi.
    • Strona określa, gdzie jest renderowany składnik główny App . Składnik jest renderowany w lokalizacji div elementu DOM z wartością idapp (<div id="app">Loading...</div>).

  • Program.cs: punkt wejścia aplikacji, który konfiguruje hosta zestawu WebAssembly:

    • Składnik App jest głównym składnikiem aplikacji. Składnik App jest określony jako div element DOM z wartością id (<div id="app">Loading...</div> w wwwroot/index.html) do kolekcji składników app głównych (builder.RootComponents.Add<App>("#app")).
    • Usługi są dodawane i konfigurowane (na przykład builder.Services.AddSingleton<IMyDependency, MyDependency>()).

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej na podstawie szablonu projektu po skonfigurowaniu Blazor WebAssembly dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Blazor WebAssembly

Blazor WebAssembly szablony projektów: blazorwasm, blazorwasm-empty

Szablony Blazor WebAssembly tworzą początkowe pliki i strukturę katalogów dla Blazor WebAssembly aplikacji:

  • blazorwasm Jeśli szablon jest używany, aplikacja zostanie wypełniona następującymi elementami:
    • Kod demonstracyjny dla FetchData składnika, który ładuje dane ze statycznego zasobu (weather.json) i interakcji użytkownika ze składnikiem Counter .
    • Zestaw narzędzi frontonu bootstrap .
  • blazorwasm-empty Jeśli szablon jest używany, aplikacja jest tworzona bez demonstracyjnego kodu i bootstrap.

Struktura projektu:

  • Pages folder: zawiera składniki routingu BlazorRazor aplikacji (.razor). Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące składniki:

    • Counter component (Counter.razor): implementuje stronę Licznik.
    • FetchData component (FetchData.razor): implementuje stronę Pobierania danych.
    • Index component (Index.razor): implementuje Home stronę.

  • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

  • Shared folder: zawiera następujące składniki udostępnione i arkusze stylów:

    • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
    • MainLayout.razor.css: arkusz stylów dla głównego układu aplikacji.
    • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink automatycznie wskazuje wybrany stan po załadowaniu składnika, co pomaga użytkownikowi zrozumieć, który składnik jest aktualnie wyświetlany.
    • NavMenu.razor.css: arkusz stylów dla menu nawigacji aplikacji.
    • SurveyPromptcomponent () (SurveyPrompt.razorASP.NET Core na platformie .NET 7 lub starszym): Blazor składnik ankiety.

  • wwwroot folder: folder główny sieci Web dla aplikacji zawierający publiczne zasoby statyczne aplikacji, w tym appsettings.json pliki ustawień aplikacji środowiskowych dla ustawień konfiguracji. Strona index.html internetowa to strona główna aplikacji zaimplementowana jako strona HTML:

    • Gdy każda strona aplikacji jest początkowo żądana, ta strona jest renderowana i zwracana w odpowiedzi.
    • Strona określa, gdzie jest renderowany składnik główny App . Składnik jest renderowany w lokalizacji div elementu DOM z wartością idapp (<div id="app">Loading...</div>).

  • _Imports.razor: zawiera wspólne Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

  • App.razor: składnik główny aplikacji, który konfiguruje routing po stronie klienta przy użyciu Router składnika. Składnik Router przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

  • Program.cs: punkt wejścia aplikacji, który konfiguruje hosta zestawu WebAssembly:

    • Składnik App jest głównym składnikiem aplikacji. Składnik App jest określony jako div element DOM z wartością id (<div id="app">Loading...</div> w wwwroot/index.html) do kolekcji składników app głównych (builder.RootComponents.Add<App>("#app")).
    • Usługi są dodawane i konfigurowane (na przykład builder.Services.AddSingleton<IMyDependency, MyDependency>()).

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej na podstawie szablonu projektu po skonfigurowaniu Blazor WebAssembly dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Blazor WebAssembly Hostowane rozwiązanie obejmuje następujące projekty ASP.NET Core:

  • "Client": Blazor WebAssembly Aplikacja.
  • "Server": Aplikacja, która obsługuje Blazor WebAssembly dane dotyczące aplikacji i pogody dla klientów.
  • "Shared": Projekt, który obsługuje typowe klasy, metody i zasoby.

Rozwiązanie jest generowane na podstawie Blazor WebAssembly szablonu projektu w programie Visual Studio z zaznaczonym polem wyboru ASP.NET Core Hosted lub z -ho|--hosted opcją przy użyciu polecenia interfejsu wiersza polecenia platformy dotnet new blazorwasm .NET. Aby uzyskać więcej informacji, zobacz Tooling for ASP.NET Core Blazor.

Struktura projektu aplikacji po stronie klienta w hostowanym Blazor rozwiązaniu Webassembly ("Client" projektu) jest taka sama jak struktura projektu dla autonomicznej Blazor WebAssembly aplikacji. Dodatkowe pliki w rozwiązaniu hostowanym Blazor WebAssembly :

  • Projekt "Server" zawiera kontroler prognozy pogody, Controllers/WeatherForecastController.cs który zwraca dane pogodowe do składnika projektu FetchData "Client".
  • Projekt "Shared" zawiera klasę prognozy pogody, WeatherForecast.cs która reprezentuje dane pogodowe dla projektów "Client" i "Server".

Blazor WebAssembly

Blazor WebAssembly szablon projektu: blazorwasm

Szablon Blazor WebAssembly tworzy początkowe pliki i strukturę katalogów dla Blazor WebAssembly aplikacji. Aplikacja jest wypełniana kodem demonstracyjnym FetchData dla składnika, który ładuje dane ze statycznego zasobu, weather.jsonoraz interakcję użytkownika z składnikiem Counter .

  • Pages folder: zawiera składniki routingu BlazorRazor aplikacji (.razor). Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące składniki:

    • Counter component (Counter.razor): implementuje stronę Licznik.
    • FetchData component (FetchData.razor): implementuje stronę Pobierania danych.
    • Index component (Index.razor): implementuje Home stronę.

  • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

  • Shared folder: zawiera następujące składniki udostępnione i arkusze stylów:

    • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
    • MainLayout.razor.css: arkusz stylów dla głównego układu aplikacji.
    • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink automatycznie wskazuje wybrany stan po załadowaniu składnika, co pomaga użytkownikowi zrozumieć, który składnik jest aktualnie wyświetlany.
    • NavMenu.razor.css: arkusz stylów dla menu nawigacji aplikacji.
    • SurveyPrompt składnik (SurveyPrompt.razor): Blazor składnik ankiety.

  • wwwroot folder: folder główny sieci Web dla aplikacji zawierający publiczne zasoby statyczne aplikacji, w tym appsettings.json pliki ustawień aplikacji środowiskowych dla ustawień konfiguracji. Strona index.html internetowa to strona główna aplikacji zaimplementowana jako strona HTML:

    • Gdy każda strona aplikacji jest początkowo żądana, ta strona jest renderowana i zwracana w odpowiedzi.
    • Strona określa, gdzie jest renderowany składnik główny App . Składnik jest renderowany w lokalizacji div elementu DOM z wartością idapp (<div id="app">Loading...</div>).

  • _Imports.razor: zawiera wspólne Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

  • App.razor: składnik główny aplikacji, który konfiguruje routing po stronie klienta przy użyciu Router składnika. Składnik Router przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

  • Program.cs: punkt wejścia aplikacji, który konfiguruje hosta zestawu WebAssembly:

    • Składnik App jest głównym składnikiem aplikacji. Składnik App jest określony jako div element DOM z wartością id (<div id="app">Loading...</div> w wwwroot/index.html) do kolekcji składników app głównych (builder.RootComponents.Add<App>("#app")).
    • Usługi są dodawane i konfigurowane (na przykład builder.Services.AddSingleton<IMyDependency, MyDependency>()).

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej na podstawie szablonu projektu po skonfigurowaniu Blazor WebAssembly dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Blazor WebAssembly Hostowane rozwiązanie obejmuje następujące projekty ASP.NET Core:

  • "Client": Blazor WebAssembly Aplikacja.
  • "Server": Aplikacja, która obsługuje Blazor WebAssembly dane dotyczące aplikacji i pogody dla klientów.
  • "Shared": Projekt, który obsługuje typowe klasy, metody i zasoby.

Rozwiązanie jest generowane na podstawie Blazor WebAssembly szablonu projektu w programie Visual Studio z zaznaczonym polem wyboru ASP.NET Core Hosted lub z -ho|--hosted opcją przy użyciu polecenia interfejsu wiersza polecenia platformy dotnet new blazorwasm .NET. Aby uzyskać więcej informacji, zobacz Tooling for ASP.NET Core Blazor.

Struktura projektu aplikacji po stronie klienta w hostowanym Blazor rozwiązaniu Webassembly ("Client" projektu) jest taka sama jak struktura projektu dla autonomicznej Blazor WebAssembly aplikacji. Dodatkowe pliki w rozwiązaniu hostowanym Blazor WebAssembly :

  • Projekt "Server" zawiera kontroler prognozy pogody, Controllers/WeatherForecastController.cs który zwraca dane pogodowe do składnika projektu FetchData "Client".
  • Projekt "Shared" zawiera klasę prognozy pogody, WeatherForecast.cs która reprezentuje dane pogodowe dla projektów "Client" i "Server".

Blazor WebAssembly

Blazor WebAssembly szablon projektu: blazorwasm

Szablon Blazor WebAssembly tworzy początkowe pliki i strukturę katalogów dla Blazor WebAssembly aplikacji. Aplikacja jest wypełniana kodem demonstracyjnym FetchData dla składnika, który ładuje dane ze statycznego zasobu, weather.jsonoraz interakcję użytkownika z składnikiem Counter .

  • Pages folder: zawiera składniki routingu BlazorRazor aplikacji (.razor). Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące składniki:

    • Counter component (Counter.razor): implementuje stronę Licznik.
    • FetchData component (FetchData.razor): implementuje stronę Pobierania danych.
    • Index component (Index.razor): implementuje Home stronę.

  • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

  • Shared folder: zawiera następujące składniki udostępnione i arkusze stylów:

    • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
    • MainLayout.razor.css: arkusz stylów dla głównego układu aplikacji.
    • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink automatycznie wskazuje wybrany stan po załadowaniu składnika, co pomaga użytkownikowi zrozumieć, który składnik jest aktualnie wyświetlany.
    • NavMenu.razor.css: arkusz stylów dla menu nawigacji aplikacji.
    • SurveyPrompt składnik (SurveyPrompt.razor): Blazor składnik ankiety.

  • wwwroot folder: folder główny sieci Web dla aplikacji zawierający publiczne zasoby statyczne aplikacji, w tym appsettings.json pliki ustawień aplikacji środowiskowych dla ustawień konfiguracji. Strona index.html internetowa to strona główna aplikacji zaimplementowana jako strona HTML:

    • Gdy każda strona aplikacji jest początkowo żądana, ta strona jest renderowana i zwracana w odpowiedzi.
    • Strona określa, gdzie jest renderowany składnik główny App . Składnik jest renderowany w lokalizacji div elementu DOM z wartością idapp (<div id="app">Loading...</div>).

  • _Imports.razor: zawiera wspólne Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

  • App.razor: składnik główny aplikacji, który konfiguruje routing po stronie klienta przy użyciu Router składnika. Składnik Router przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

  • Program.cs: punkt wejścia aplikacji, który konfiguruje hosta zestawu WebAssembly:

    • Składnik App jest głównym składnikiem aplikacji. Składnik App jest określony jako div element DOM z wartością id (<div id="app">Loading...</div> w wwwroot/index.html) do kolekcji składników app głównych (builder.RootComponents.Add<App>("#app")).
    • Usługi są dodawane i konfigurowane (na przykład builder.Services.AddSingleton<IMyDependency, MyDependency>()).

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej na podstawie szablonu projektu po skonfigurowaniu Blazor WebAssembly dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Blazor WebAssembly Hostowane rozwiązanie obejmuje następujące projekty ASP.NET Core:

  • "Client": Blazor WebAssembly Aplikacja.
  • "Server": Aplikacja, która obsługuje Blazor WebAssembly dane dotyczące aplikacji i pogody dla klientów.
  • "Shared": Projekt, który obsługuje typowe klasy, metody i zasoby.

Rozwiązanie jest generowane na podstawie Blazor WebAssembly szablonu projektu w programie Visual Studio z zaznaczonym polem wyboru ASP.NET Core Hosted lub z -ho|--hosted opcją przy użyciu polecenia interfejsu wiersza polecenia platformy dotnet new blazorwasm .NET. Aby uzyskać więcej informacji, zobacz Tooling for ASP.NET Core Blazor.

Struktura projektu aplikacji po stronie klienta w hostowanym Blazor rozwiązaniu Webassembly ("Client" projektu) jest taka sama jak struktura projektu dla autonomicznej Blazor WebAssembly aplikacji. Dodatkowe pliki w rozwiązaniu hostowanym Blazor WebAssembly :

  • Projekt "Server" zawiera kontroler prognozy pogody, Controllers/WeatherForecastController.cs który zwraca dane pogodowe do składnika projektu FetchData "Client".
  • Projekt "Shared" zawiera klasę prognozy pogody, WeatherForecast.cs która reprezentuje dane pogodowe dla projektów "Client" i "Server".

Blazor WebAssembly

Blazor WebAssembly szablon projektu: blazorwasm

Szablon Blazor WebAssembly tworzy początkowe pliki i strukturę katalogów dla Blazor WebAssembly aplikacji. Aplikacja jest wypełniana kodem demonstracyjnym FetchData dla składnika, który ładuje dane ze statycznego zasobu, weather.jsonoraz interakcję użytkownika z składnikiem Counter .

  • Pages folder: zawiera składniki routingu BlazorRazor aplikacji (.razor). Trasa dla każdej strony jest określana przy użyciu @page dyrektywy . Szablon zawiera następujące składniki:

    • Counter component (Counter.razor): implementuje stronę Licznik.
    • FetchData component (FetchData.razor): implementuje stronę Pobierania danych.
    • Index component (Index.razor): implementuje Home stronę.

  • Properties folder: przechowuje konfigurację środowiska programistycznego launchSettings.json w pliku.

  • Shared folder: zawiera następujące składniki udostępnione:

    • MainLayoutcomponent (MainLayout.razor): składnik układu aplikacji.
    • NavMenu component (NavMenu.razor): implementuje nawigację na pasku bocznym. NavLink Zawiera składnik (NavLink), który renderuje łącza nawigacji do innych Razor składników. Składnik NavLink automatycznie wskazuje wybrany stan po załadowaniu składnika, co pomaga użytkownikowi zrozumieć, który składnik jest aktualnie wyświetlany.
    • SurveyPrompt składnik (SurveyPrompt.razor): Blazor składnik ankiety.

  • wwwroot folder: folder główny sieci Web dla aplikacji zawierający publiczne zasoby statyczne aplikacji, w tym appsettings.json pliki ustawień aplikacji środowiskowych dla ustawień konfiguracji. Strona index.html internetowa to strona główna aplikacji zaimplementowana jako strona HTML:

    • Gdy każda strona aplikacji jest początkowo żądana, ta strona jest renderowana i zwracana w odpowiedzi.
    • Strona określa, gdzie jest renderowany składnik główny App . Składnik jest renderowany w lokalizacji app elementu DOM (<app>Loading...</app>).

  • _Imports.razor: zawiera wspólne Razor dyrektywy, które mają być uwzględniane w składnikach aplikacji (.razor), takich jak @using dyrektywy dla przestrzeni nazw.

  • App.razor: składnik główny aplikacji, który konfiguruje routing po stronie klienta przy użyciu Router składnika. Składnik Router przechwytuje nawigację przeglądarki i renderuje stronę zgodną z żądanym adresem.

  • Program.cs: punkt wejścia aplikacji, który konfiguruje hosta zestawu WebAssembly:

    • Składnik App jest głównym składnikiem aplikacji. Składnik App jest określony jako app element DOM (<app>Loading...</app> w wwwroot/index.html) do kolekcji składników głównych (builder.RootComponents.Add<App>("app")).
    • Usługi są dodawane i konfigurowane (na przykład builder.Services.AddSingleton<IMyDependency, MyDependency>()).

Dodatkowe pliki i foldery mogą być wyświetlane w aplikacji utworzonej na podstawie szablonu projektu po skonfigurowaniu Blazor WebAssembly dodatkowych opcji. Na przykład generowanie aplikacji z ASP.NET Core Identity obejmuje dodatkowe zasoby na potrzeby funkcji uwierzytelniania i autoryzacji.

Blazor WebAssembly Hostowane rozwiązanie obejmuje następujące projekty ASP.NET Core:

  • "Client": Blazor WebAssembly Aplikacja.
  • "Server": Aplikacja, która obsługuje Blazor WebAssembly dane dotyczące aplikacji i pogody dla klientów.
  • "Shared": Projekt, który obsługuje typowe klasy, metody i zasoby.

Rozwiązanie jest generowane na podstawie Blazor WebAssembly szablonu projektu w programie Visual Studio z zaznaczonym polem wyboru ASP.NET Core Hosted lub z -ho|--hosted opcją przy użyciu polecenia interfejsu wiersza polecenia platformy dotnet new blazorwasm .NET. Aby uzyskać więcej informacji, zobacz Tooling for ASP.NET Core Blazor.

Struktura projektu aplikacji po stronie klienta w hostowanym Blazor rozwiązaniu Webassembly ("Client" projektu) jest taka sama jak struktura projektu dla autonomicznej Blazor WebAssembly aplikacji. Dodatkowe pliki w rozwiązaniu hostowanym Blazor WebAssembly :

  • Projekt "Server" zawiera kontroler prognozy pogody, Controllers/WeatherForecastController.cs który zwraca dane pogodowe do składnika projektu FetchData "Client".
  • Projekt "Shared" zawiera klasę prognozy pogody, WeatherForecast.cs która reprezentuje dane pogodowe dla projektów "Client" i "Server".

Lokalizacja skryptu Blazor

Skrypt Blazor jest obsługiwany z zasobu osadzonego w strukturze udostępnionej ASP.NET Core.

Blazor W aplikacji Blazor internetowej skrypt znajduje się w Components/App.razor pliku:

<script src="_framework/blazor.web.js"></script>

Blazor Server W aplikacji Blazor skrypt znajduje się w Pages/_Host.cshtml pliku:

<script src="_framework/blazor.server.js"></script>

Blazor Server W aplikacji Blazor skrypt znajduje się w Pages/_Host.cshtml pliku:

<script src="_framework/blazor.server.js"></script>

Blazor Server W aplikacji Blazor skrypt znajduje się w Pages/_Layout.cshtml pliku:

<script src="_framework/blazor.server.js"></script>

Blazor Server W aplikacji Blazor skrypt znajduje się w Pages/_Host.cshtml pliku:

<script src="_framework/blazor.server.js"></script>

Blazor WebAssembly W aplikacji zawartość skryptu Blazorwwwroot/index.html znajduje się w pliku:

<script src="_framework/blazor.webassembly.js"></script>

<head> Lokalizacja i <body> zawartość

Blazor W aplikacji <head> internetowej i <body> zawartość znajduje się w Components/App.razor pliku.

Blazor Server W aplikacji <head> i <body> zawartość znajduje się w Pages/_Host.cshtml pliku.

Blazor Server W aplikacji <head> i <body> zawartość znajduje się w Pages/_Layout.cshtml pliku.

Blazor Server W aplikacji <head> i <body> zawartość znajduje się w Pages/_Host.cshtml pliku.

Blazor WebAssembly W aplikacji <head> i <body> zawartość znajduje się w wwwroot/index.html pliku.

Podwójna Blazor Server/Blazor WebAssembly aplikacja

Aby utworzyć aplikację, która może działać jako Blazor Server aplikacja lub Blazor WebAssembly aplikacja, jednym z podejść jest umieszczenie całej logiki i składników aplikacji w Razor bibliotece klas (RCL) i odwołowanie się do listy RCL z oddzielnych Blazor Server i Blazor WebAssembly projektów. W przypadku typowych usług, których implementacje różnią się w zależności od modelu hostingu, zdefiniuj interfejsy usług na liście RCL i zaimplementuj usługi w Blazor Server projektach i Blazor WebAssembly .

Dodatkowe zasoby