ASP.NET file statici core Blazor
Nota
Questa non è la versione più recente di questo articolo. Per la versione corrente, vedere la versione .NET 8 di questo articolo.
Avviso
Questa versione di ASP.NET Core non è più supportata. Per altre informazioni, vedere Criteri di supporto di .NET e .NET Core. Per la versione corrente, vedere la versione .NET 8 di questo articolo.
Importante
Queste informazioni si riferiscono a un prodotto non definitive che può essere modificato in modo sostanziale prima che venga rilasciato commercialmente. Microsoft non riconosce alcuna garanzia, espressa o implicita, in merito alle informazioni qui fornite.
Per la versione corrente, vedere la versione .NET 8 di questo articolo.
Questo articolo descrive la Blazor configurazione dell'app per la gestione di file statici.
Middleware degli asset statici
Questa sezione si applica alle app lato Blazor server.
La gestione degli asset statici viene gestita da uno dei due middleware descritti nella tabella seguente.
Middleware | API | Versione .NET | Descrizione |
---|---|---|---|
Eseguire il mapping di asset statici | MapStaticAssets |
.NET 9 o versione successiva | Ottimizza il recapito di asset statici ai client. |
File statici | UseStaticFiles | Tutte le versioni di .NET | Serve asset statici ai client senza ottimizzazioni di MapStaticAssets ma utili per alcune attività che MapStaticAssets non sono in grado di gestire. |
Configurare il middleware map static assets chiamando MapStaticAssets
nella pipeline di elaborazione delle richieste dell'app, che esegue le operazioni seguenti:
- Imposta le intestazioni ETag e Last-Modified .
- Imposta le intestazioni di memorizzazione nella cache.
- Usa il middleware di memorizzazione nella cache.
- Quando possibile, serve asset statici compressi .
- Funziona con un rete per la distribuzione di contenuti (rete CDN) (ad esempio, Rete CDN di Azure) per gestire gli asset statici dell'app più vicini all'utente.
- Minimizza gli asset statici dell'app.
MapStaticAssets
opera combinando processi di compilazione e pubblicazione per raccogliere informazioni sugli asset statici nell'app. Queste informazioni vengono utilizzate dalla libreria di runtime per gestire in modo efficiente gli asset statici ai browser.
MapStaticAssets
può sostituire UseStaticFiles nella maggior parte delle situazioni. Tuttavia, MapStaticAssets
è ottimizzato per gestire gli asset da posizioni note nell'app in fase di compilazione e pubblicazione. Se l'app serve asset da altre posizioni, ad esempio risorse disco o incorporate, UseStaticFiles deve essere usata.
MapStaticAssets
offre i vantaggi seguenti non trovati con UseStaticFiles:
- Compressione in fase di compilazione per tutti gli asset nell'app: Gzip (
Content-Encoding: gz
) durante lo sviluppo e Gzip con Brotli (Content-Encoding: br
) durante la pubblicazione. - I contenuti basati su
ETags
vengono generati per ogni asset statico, ovvero stringhe con codifica Base64 degli hash SHA-256 degli asset statici. In questo modo, il browser scarica nuovamente un file solo se il contenuto è stato modificato.
Il middleware dei file statici (UseStaticFiles) è utile nelle situazioni seguenti che MapStaticAssets
non possono essere gestite:
- Applicazione di un prefisso di percorso ai Blazor WebAssembly file di asset statici, illustrati nella sezione Prefisso per Blazor WebAssembly gli asset .
- Configurazione dei mapping di file di estensioni a tipi di contenuto specifici e impostazione di opzioni di file statiche, descritte nella sezione Mapping file e opzioni di file statici.
Configurare il middleware dei file statici per gestire asset statici ai client chiamando UseStaticFiles nella pipeline di elaborazione delle richieste dell'app. Per altre informazioni, vedere File statici in ASP.NET Core.
Nelle versioni precedenti a .NET 8, Blazor i file statici del framework, ad esempio lo Blazor script, vengono gestiti tramite middleware di file statici. In .NET 8 o versione successiva, Blazor i file statici del framework vengono mappati usando il routing degli endpoint e il middleware dei file statici non viene più usato.
Modalità progetto asset Web statico
Questa sezione si applica al .Client
progetto di un'app Blazor Web.
L'impostazione .Client
richiesta <StaticWebAssetProjectMode>Default</StaticWebAssetProjectMode>
nel progetto di un'app Blazor Web ripristina Blazor WebAssembly i comportamenti degli asset statici ai valori predefiniti, in modo che il progetto si comporti come parte del progetto ospitato. L'SDK Blazor WebAssembly (Microsoft.NET.Sdk.BlazorWebAssembly
) configura gli asset Web statici in modo specifico per funzionare in modalità "autonoma" con un server che usa semplicemente gli output dalla libreria. Questo non è appropriato per un'app Blazor Web, in cui la parte WebAssembly dell'app è una parte logica dell'host e deve comportarsi in modo più simile a una libreria. Ad esempio, il progetto non espone il bundle di stili (ad esempio , BlazorSample.Client.styles.css
) e fornisce invece solo l'host con il bundle di progetto, in modo che l'host possa includerlo nel proprio bundle di stili.
La modifica del valore (Default
) di <StaticWebAssetProjectMode>
o la rimozione della proprietà dal .Client
progetto non è supportata.
File statici in ambienti nonDevelopment
Questa sezione si applica ai file statici lato server.
Quando si esegue un'app in locale, gli asset Web statici sono abilitati solo per impostazione predefinita nell'ambiente Development . Per abilitare i file statici per ambienti diversi da Development durante lo sviluppo locale e il test (ad esempio, Staging), chiamare UseStaticWebAssets nel WebApplicationBuilderProgram
file .
Avviso
Chiamare UseStaticWebAssets l'ambiente esatto per impedire l'attivazione della funzionalità nell'ambiente di produzione, perché serve i file da percorsi separati su disco diverso dal progetto se chiamato in un ambiente di produzione. L'esempio in questa sezione controlla l'ambiente Staging chiamando IsStaging.
if (builder.Environment.IsStaging())
{
builder.WebHost.UseStaticWebAssets();
}
Prefisso per Blazor WebAssembly gli asset
Questa sezione si applica a Blazor App Web.
Usare l'opzione WebAssemblyComponentsEndpointOptions.PathPrefix endpoint per impostare la stringa di percorso che indica il prefisso per Blazor WebAssembly gli asset. Il percorso deve corrispondere a un progetto di applicazione a cui si fa Blazor WebAssembly riferimento.
endpoints.MapRazorComponents<App>()
.AddInteractiveWebAssemblyRenderMode(options =>
options.PathPrefix = "{PATH PREFIX}");
Nell'esempio precedente il {PATH PREFIX}
segnaposto è il prefisso del percorso e deve iniziare con una barra (/
).
Nell'esempio seguente il prefisso del percorso è impostato su /path-prefix
:
endpoints.MapRazorComponents<App>()
.AddInteractiveWebAssemblyRenderMode(options =>
options.PathPrefix = "/path-prefix");
Percorso di base dell'asset Web statico
Questa sezione si applica alle app autonome Blazor WebAssembly .
Per impostazione predefinita, la pubblicazione dell'app inserisce gli asset statici dell'app, inclusi Blazor i file framework (_framework
asset di cartelle), nel percorso radice (/
) nell'output pubblicato. La <StaticWebAssetBasePath>
proprietà specificata nel file di progetto (.csproj
) imposta il percorso di base su un percorso non radice:
<PropertyGroup>
<StaticWebAssetBasePath>{PATH}</StaticWebAssetBasePath>
</PropertyGroup>
Nell'esempio precedente il {PATH}
segnaposto è il percorso.
Senza impostare la <StaticWebAssetBasePath>
proprietà, un'app autonoma viene pubblicata in /BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/
.
Nell'esempio precedente il {TFM}
segnaposto è il moniker del framework di destinazione (TFM), ad esempio net6.0
.
Se la <StaticWebAssetBasePath>
proprietà in un'app autonoma Blazor WebAssembly imposta il percorso dell'asset statico pubblicato su app1
, il percorso radice dell'app nell'output pubblicato è /app1
.
Nel file di progetto dell'app autonoma Blazor WebAssembly (.csproj
):
<PropertyGroup>
<StaticWebAssetBasePath>app1</StaticWebAssetBasePath>
</PropertyGroup>
Nell'output pubblicato il percorso dell'app autonoma Blazor WebAssembly è /BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/app1/
.
Nell'esempio precedente il {TFM}
segnaposto è il moniker del framework di destinazione (TFM), ad esempio net6.0
.
Questa sezione si applica alle app autonome Blazor WebAssembly e alle soluzioni ospitate Blazor WebAssembly .
Per impostazione predefinita, la pubblicazione dell'app inserisce gli asset statici dell'app, inclusi Blazor i file framework (_framework
asset di cartelle), nel percorso radice (/
) nell'output pubblicato. La <StaticWebAssetBasePath>
proprietà specificata nel file di progetto (.csproj
) imposta il percorso di base su un percorso non radice:
<PropertyGroup>
<StaticWebAssetBasePath>{PATH}</StaticWebAssetBasePath>
</PropertyGroup>
Nell'esempio precedente il {PATH}
segnaposto è il percorso.
Senza impostare la <StaticWebAssetBasePath>
proprietà, l'app client di una soluzione ospitata o un'app autonoma viene pubblicata nei percorsi seguenti:
- Server Nel progetto di una soluzione ospitataBlazor WebAssembly:
/BlazorHostedSample/Server/bin/Release/{TFM}/publish/wwwroot/
- In un'app autonoma Blazor WebAssembly :
/BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/
Se la <StaticWebAssetBasePath>
proprietà nel Client progetto di un'app ospitata Blazor WebAssembly o in un'app autonoma Blazor WebAssembly imposta il percorso dell'asset statico pubblicato su app1
, il percorso radice dell'app nell'output pubblicato è /app1
.
Client Nel file di progetto dell'app (.csproj
) o nel file di progetto dell'app autonoma Blazor WebAssembly (.csproj
):
<PropertyGroup>
<StaticWebAssetBasePath>app1</StaticWebAssetBasePath>
</PropertyGroup>
Nell'output pubblicato:
- Percorso dell'app client nel Server progetto di una soluzione ospitata Blazor WebAssembly :
/BlazorHostedSample/Server/bin/Release/{TFM}/publish/wwwroot/app1/
- Percorso di un'app autonoma Blazor WebAssembly :
/BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/app1/
La <StaticWebAssetBasePath>
proprietà viene usata più comunemente per controllare i percorsi per pubblicare asset statici di più Blazor WebAssembly app in una singola distribuzione ospitata. Per altre informazioni, vedere Più app ospitate ASP.NET CoreBlazor WebAssembly. La proprietà è efficace anche nelle app autonome Blazor WebAssembly .
Negli esempi precedenti il {TFM}
segnaposto è il moniker del framework di destinazione (TFM), ad esempio net6.0
.
Mapping di file e opzioni di file statici
Questa sezione si applica ai file statici lato server.
Per creare mapping di file aggiuntivi con un oggetto o configurare un FileExtensionContentTypeProvider altro StaticFileOptions, usare uno degli approcci seguenti. Negli esempi seguenti il {EXTENSION}
segnaposto è l'estensione di file e il {CONTENT TYPE}
segnaposto è il tipo di contenuto. Lo spazio dei nomi per l'API seguente è Microsoft.AspNetCore.StaticFiles.
Configurare le opzioni tramite l'inserimento
Program
delle dipendenze nel file usando StaticFileOptions:var provider = new FileExtensionContentTypeProvider(); provider.Mappings["{EXTENSION}"] = "{CONTENT TYPE}"; builder.Services.Configure<StaticFileOptions>(options => { options.ContentTypeProvider = provider; }); app.UseStaticFiles();
Passare direttamente StaticFileOptions a UseStaticFiles nel
Program
file:var provider = new FileExtensionContentTypeProvider(); provider.Mappings["{EXTENSION}"] = "{CONTENT TYPE}"; app.UseStaticFiles(new StaticFileOptions { ContentTypeProvider = provider });
Per creare mapping di file aggiuntivi con un oggetto o configurare un FileExtensionContentTypeProvider altro StaticFileOptions, usare uno degli approcci seguenti. Negli esempi seguenti il {EXTENSION}
segnaposto è l'estensione di file e il {CONTENT TYPE}
segnaposto è il tipo di contenuto.
Configurare le opzioni tramite l'inserimento
Program
delle dipendenze nel file usando StaticFileOptions:using Microsoft.AspNetCore.StaticFiles; ... var provider = new FileExtensionContentTypeProvider(); provider.Mappings["{EXTENSION}"] = "{CONTENT TYPE}"; builder.Services.Configure<StaticFileOptions>(options => { options.ContentTypeProvider = provider; });
Questo approccio configura lo stesso provider di file usato per gestire lo Blazor script. Assicurarsi che la configurazione personalizzata non interferisca con la gestione dello Blazor script. Ad esempio, non rimuovere il mapping per i file JavaScript configurando il provider con
provider.Mappings.Remove(".js")
.Usare due chiamate a UseStaticFiles nel
Program
file:- Configurare il provider di file personalizzato nella prima chiamata con StaticFileOptions.
- Il secondo middleware serve lo Blazor script, che usa la configurazione predefinita dei file statici fornita dal Blazor framework.
using Microsoft.AspNetCore.StaticFiles; ... var provider = new FileExtensionContentTypeProvider(); provider.Mappings["{EXTENSION}"] = "{CONTENT TYPE}"; app.UseStaticFiles(new StaticFileOptions { ContentTypeProvider = provider }); app.UseStaticFiles();
È possibile evitare di interferire con la gestione
_framework/blazor.server.js
usando MapWhen per eseguire un middleware di file statico personalizzato:app.MapWhen(ctx => !ctx.Request.Path .StartsWithSegments("/_framework/blazor.server.js"), subApp => subApp.UseStaticFiles(new StaticFileOptions() { ... }));
Risorse aggiuntive
Commenti e suggerimenti
https://aka.ms/ContentUserFeedback.
Presto disponibile: Nel corso del 2024 verranno gradualmente disattivati i problemi di GitHub come meccanismo di feedback per il contenuto e ciò verrà sostituito con un nuovo sistema di feedback. Per altre informazioni, vedereInvia e visualizza il feedback per