ASP.NET Core Blazor plików statycznych

W tym artykule opisano Blazor konfigurację aplikacji do obsługi plików statycznych.

Blazor pliki statyczne struktury

W wersjach wcześniejszych niż .NET 8 pliki statyczne platformy, Blazor takie jak Blazor skrypt, są obsługiwane za pośrednictwem oprogramowania pośredniczącego plików statycznych. W programie .NET 8 lub nowszym Blazor pliki statyczne platformy są mapowane przy użyciu routingu punktu końcowego, a oprogramowanie pośredniczące plików statycznych nie jest już używane.

Tryb projektu statycznego zasobu internetowego

Ta sekcja dotyczy .Client projektu Blazor aplikacji internetowej.

Wymagane <StaticWebAssetProjectMode>Default</StaticWebAssetProjectMode> ustawienie w .Client projekcie Blazor aplikacji internetowej przywraca Blazor WebAssembly statyczne zachowania zasobów z powrotem do wartości domyślnych, tak aby projekt zachowywał się jako część hostowanego projektu. Zestaw Blazor WebAssembly SDK (Microsoft.NET.Sdk.BlazorWebAssembly) konfiguruje statyczne zasoby internetowe w określony sposób, aby działały w trybie "autonomicznym" przy użyciu serwera po prostu zużywając dane wyjściowe z biblioteki. Nie jest to odpowiednie dla Blazor aplikacji internetowej, gdzie część webAssembly aplikacji jest logiczną częścią hosta i musi zachowywać się bardziej jak biblioteka. Na przykład projekt nie uwidacznia pakietu stylów (na przykład BlazorSample.Client.styles.css) i zamiast tego udostępnia hostowi tylko pakiet projektu, dzięki czemu host może uwzględnić go we własnym pakiecie stylów.

Zmiana wartości (Default) <StaticWebAssetProjectMode> lub usunięcia właściwości z .Client projektu nie jest obsługiwana.

Oprogramowanie pośredniczące plików statycznych

Ta sekcja dotyczy aplikacji po stronie Blazor serwera.

Skonfiguruj oprogramowanie pośredniczące pliku statycznego w celu udostępniania statycznych zasobów klientom przez wywołanie UseStaticFiles w potoku przetwarzania żądań aplikacji. Aby uzyskać więcej informacji, zobacz Pliki statyczne platformy ASP.NET Core.

Pliki statyczne w środowiskach innych niżDevelopment

Ta sekcja dotyczy plików statycznych po stronie serwera.

W przypadku lokalnego uruchamiania aplikacji statyczne zasoby internetowe są domyślnie włączone tylko w Development środowisku. Aby włączyć pliki statyczne dla środowisk innych niż Development podczas lokalnego programowania i testowania (na przykład Staging), wywołaj WebApplicationBuilderUseStaticWebAssets element w Program pliku .

Ostrzeżenie

Wywołaj UseStaticWebAssets dokładne środowisko, aby zapobiec aktywowaniu funkcji w środowisku produkcyjnym, ponieważ obsługuje pliki z oddzielnych lokalizacji na dysku innym niż projekt, jeśli jest wywoływany w środowisku produkcyjnym. Przykład w tej sekcji sprawdza Staging środowisko przez wywołanie metody IsStaging.

if (builder.Environment.IsStaging())
{
    builder.WebHost.UseStaticWebAssets();
}

Prefiks dla Blazor WebAssembly zasobów

Ta sekcja dotyczy Blazor usługi Web Apps.

Użyj opcji punktu końcowego WebAssemblyComponentsEndpointOptions.PathPrefix , aby ustawić ciąg ścieżki wskazujący prefiks dla Blazor WebAssembly zasobów. Ścieżka musi odpowiadać projektowi Blazor WebAssembly aplikacji, do których się odwołujesz.

endpoints.MapRazorComponents<App>()
    .AddInteractiveWebAssemblyRenderMode(options => 
        options.PathPrefix = "{PATH PREFIX}");

W poprzednim przykładzie {PATH PREFIX} symbol zastępczy jest prefiksem ścieżki i musi zaczynać się od ukośnika (/).

W poniższym przykładzie prefiks ścieżki jest ustawiony na /path-prefix:

endpoints.MapRazorComponents<App>()
    .AddInteractiveWebAssemblyRenderMode(options => 
        options.PathPrefix = "/path-prefix");

Statyczna ścieżka podstawowa zasobu internetowego

Ta sekcja dotyczy aplikacji autonomicznych Blazor WebAssembly .

Domyślnie publikowanie aplikacji umieszcza statyczne zasoby aplikacji, w tym Blazor pliki struktury (_framework zasoby folderów), w ścieżce głównej (/) w opublikowanych danych wyjściowych. Właściwość określona <StaticWebAssetBasePath> w pliku projektu (.csproj) ustawia ścieżkę podstawową na ścieżkę inną niż główna:

<PropertyGroup>
  <StaticWebAssetBasePath>{PATH}</StaticWebAssetBasePath>
</PropertyGroup>

W poprzednim przykładzie {PATH} symbol zastępczy to ścieżka.

Bez ustawiania <StaticWebAssetBasePath> właściwości aplikacja autonomiczna jest publikowana pod adresem /BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/.

W poprzednim przykładzie {TFM} symbol zastępczy to Target Framework Moniker (TFM) (na przykład net6.0).

<StaticWebAssetBasePath> Jeśli właściwość w aplikacji autonomicznej Blazor WebAssembly ustawia opublikowaną statyczną ścieżkę zasobu na app1wartość , ścieżka główna do aplikacji w opublikowanych danych wyjściowych to /app1.

W pliku projektu aplikacji autonomicznej Blazor WebAssembly (.csproj):

<PropertyGroup>
  <StaticWebAssetBasePath>app1</StaticWebAssetBasePath>
</PropertyGroup>

W opublikowanych danych wyjściowych ścieżka do aplikacji autonomicznej Blazor WebAssembly to /BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/app1/.

W poprzednim przykładzie {TFM} symbol zastępczy to Target Framework Moniker (TFM) (na przykład net6.0).

Mapowania plików i opcje plików statycznych

Ta sekcja dotyczy plików statycznych po stronie serwera.

Aby utworzyć dodatkowe mapowania plików za pomocą elementu FileExtensionContentTypeProvider lub skonfigurować inne StaticFileOptions, użyj jednej z poniższych metod. W poniższych przykładach {EXTENSION} symbol zastępczy jest rozszerzeniem pliku, a {CONTENT TYPE} symbol zastępczy jest typem zawartości. Przestrzeń nazw dla następującego interfejsu API to Microsoft.AspNetCore.StaticFiles.

• Skonfiguruj opcje za pomocą wstrzykiwania zależności (DI) w Program pliku przy użyciu polecenia StaticFileOptions:

  var provider = new FileExtensionContentTypeProvider();
  provider.Mappings["{EXTENSION}"] = "{CONTENT TYPE}";
  
  builder.Services.Configure<StaticFileOptions>(options =>
  {
      options.ContentTypeProvider = provider;
  });
  
  app.UseStaticFiles();
  

• Przekaż plik StaticFileOptions bezpośrednio do UseStaticFiles pliku Program :

  var provider = new FileExtensionContentTypeProvider();
  provider.Mappings["{EXTENSION}"] = "{CONTENT TYPE}";
  
  app.UseStaticFiles(new StaticFileOptions { ContentTypeProvider = provider });
  

Dodatkowe zasoby

Ścieżka podstawowa aplikacji