ASP.NET Core Blazor statik dosyaları

Makale
07/17/2024

Not

Bu, bu makalenin en son sürümü değildir. Geçerli sürüm için bu makalenin .NET 8 sürümüne bakın.

Uyarı

ASP.NET Core'un bu sürümü artık desteklenmiyor. Daha fazla bilgi için bkz . .NET ve .NET Core Destek İlkesi. Geçerli sürüm için bu makalenin .NET 8 sürümüne bakın.

Önemli

Bu bilgiler, ticari olarak piyasaya sürülmeden önce önemli ölçüde değiştirilebilen bir yayın öncesi ürünle ilgilidir. Burada verilen bilgilerle ilgili olarak Microsoft açık veya zımni hiçbir garanti vermez.

Geçerli sürüm için bu makalenin .NET 8 sürümüne bakın.

Bu makalede statik dosyalara hizmet veren uygulama yapılandırması açıklanmaktadır Blazor .

Statik varlık ara yazılımı

Bu bölüm sunucu tarafı Blazor uygulamalar için geçerlidir.

Statik varlıklara hizmet sunma, aşağıdaki tabloda açıklanan iki ara yazılımdan biri tarafından yönetilir.

Ara yazılım	API	.NET Sürümü	Açıklama
Statik Varlıkları Eşleme	`MapStaticAssets`	.NET 9 veya üzeri	Statik varlıkların istemcilere teslimini iyileştirir.
Statik Dosyalar	UseStaticFiles	Tüm .NET sürümleri	statik varlıkları, iyileştirmeleri `MapStaticAssets` olmadan istemcilere sunar, ancak yönetme yeteneği olmayan bazı görevler `MapStaticAssets` için kullanışlıdır.

Aşağıdaki işlemleri gerçekleştiren uygulamanın istek işleme işlem hattında çağrı MapStaticAssets yaparak Statik Varlıkları Eşleme Ara Yazılımını yapılandırın:

ETag ve Son Değiştirilen üst bilgileri ayarlar.
Önbelleğe alma üst bilgilerini ayarlar.
Önbelleğe Alma Ara Yazılımını kullanır.
Mümkün olduğunda, sıkıştırılmış statik varlıklara hizmet eder.
Uygulamanın statik varlıklarını kullanıcıya daha yakın bir şekilde sunmak için bir Content Delivery Network (CDN) (örneğin, Azure CDN) ile çalışır.
Uygulamanın statik varlıklarını en aza indirir.
Dosyaların eski sürümlerinin yeniden kullanılmasını önlemek için varlıkların parmak izini alma.

MapStaticAssets uygulamadaki statik varlıklar hakkında bilgi toplamak için derleme ve yayımlama işlemlerini birleştirerek çalışır. Bu bilgiler, statik varlıkları tarayıcılara verimli bir şekilde sunmak için çalışma zamanı kitaplığı tarafından kullanılır.

MapStaticAssets çoğu durumda değiştirebilir UseStaticFiles . Ancak, MapStaticAssets derleme ve yayımlama zamanında uygulamadaki bilinen konumlardan varlıklara hizmet etmek için iyileştirilmiştir. Uygulama disk veya ekli kaynaklar UseStaticFiles gibi diğer konumlardan varlıklara hizmet verirse kullanılmalıdır.

MapStaticAssets , çağrılırken UseStaticFileskullanılamayabilecek aşağıdaki avantajları sağlar:

JavaScript (JS) ve stil sayfaları dahil ancak zaten sıkıştırılmış görüntü ve yazı tipi varlıkları hariç olmak üzere uygulamadaki tüm varlıklar için derleme zamanı sıkıştırması. Gzip (Content-Encoding: gz) sıkıştırması geliştirme sırasında kullanılır. Yayımlama sırasında Brotli (Content-Encoding: br) sıkıştırmalı Gzip kullanılır.
Her dosyanın içeriğinin SHA-256 karmasının Base64 kodlanmış dizesiyle derleme zamanında tüm varlıklar için parmak izi oluşturma. Bu, eski dosya önbelleğe alınmış olsa bile dosyanın eski bir sürümünün yeniden kullanılabilir olmasını önler. Parmak izi alınmış varlıklar yönergesi immutablekullanılarak önbelleğe alınır ve bu da tarayıcının değişene kadar varlığı bir daha istemesine neden olmaz. Yönergesini desteklemeyen tarayıcılar için immutable bir max-age yönerge eklenir.
- Bir varlığın parmak izi oluşturulmamış olsa bile, her statik varlık için değer olarak ETag dosyanın parmak izi karması kullanılarak içerik ETags oluşturulur. Bu, tarayıcının yalnızca içeriği değiştiğinde (veya dosya ilk kez indiriliyorsa) dosyayı indirmesini sağlar.
- Dahili olarak, Blazor fiziksel varlıkları parmak izleriyle eşler ve bu da uygulamanın şunları yapmasını sağlar:
  - 'nin CSS yalıtım özelliği için Blazorbileşen kapsamlı CSS gibi Razor otomatik olarak oluşturulan Blazor varlıkları ve JS içeri aktarma eşlemeleri tarafından JS açıklanan varlıkları bulun.
  - Varlıkları önceden yüklemek için sayfanın içeriğinde <head> bağlantı etiketleri oluşturun.
Visual Studio Çalışırken Yeniden Yükleme geliştirme testi sırasında:
- Uygulama çalışırken bir dosya değiştirildiğinde sorun yaşamamak için varlıklardan bütünlük bilgileri kaldırılır.
- Tarayıcının her zaman geçerli içeriği aldığından emin olmak için statik varlıklar önbelleğe alınmaz.

Etkileşimli WebAssembly veya Etkileşimli Otomatik işleme modları etkinleştirildiğinde:

Blazor kaynak koleksiyonunu modül olarak kullanıma sunan bir JS uç nokta oluşturur.
Url, webassembly bileşeni sayfaya işlendiğinde kalıcı bileşen durumu olarak isteğin gövdesine gönderilir.
WebAssembly önyüklemesi sırasında URL'yi alır, Blazor modülü içeri aktarır ve varlık koleksiyonunu almak ve bellekte yeniden yapılandırmak için bir işlev çağırır. URL içeriğe özeldir ve sonsuza kadar önbelleğe alınır, bu nedenle bu ek yük maliyeti uygulama güncelleştirilene kadar kullanıcı başına yalnızca bir kez ödenir.
Kaynak koleksiyonu da insan tarafından okunabilir bir URL' de (_framework/resource-collection.js ) kullanıma sunulur, bu nedenle JS gelişmiş gezinti için kaynak koleksiyonuna veya diğer çerçevelerin ve üçüncü taraf bileşenlerinin özelliklerini uygulamaya erişime sahiptir.

Statik Varlıkları Eşleme Ara Yazılımı, küçültme veya diğer dosya dönüştürmeleri için özellikler sağlamaz. Küçültme genellikle özel kod veya üçüncü taraf araçlarıyla işlenir.

Statik Dosya Ara Yazılımı (UseStaticFiles), işleyememe durumu aşağıdaki durumlarda MapStaticAssets kullanışlıdır:

Statik varlık dosyalarına, varlıklar için Blazor WebAssembly Blazor WebAssembly ön ek bölümünde ele alınan bir yol ön eki uygulama.
Uzantıların belirli içerik türlerine dosya eşlemelerini yapılandırma ve Dosya eşlemeleri ve statik dosya seçenekleri bölümünde ele alınan statik dosya seçeneklerini ayarlama.

Statik Dosya Ara Yazılımını Eşleme ile varlıkları kullanma

Bu bölüm sunucu tarafı Blazor uygulamalar için geçerlidir.

Varlıklar, belirli bir varlığın ComponentBase.Assets parmak iziyle kaydedilen URL'sini çözümleyen özelliği aracılığıyla tüketilir. Aşağıdaki örnekte Bootstrap, Blazor proje şablonu uygulama stil sayfası (app.css ) ve CSS yalıtım stil sayfası , genellikle App bileşen (Components/App.razor):

<link rel="stylesheet" href="@Assets["bootstrap/bootstrap.min.css"]" />
<link rel="stylesheet" href="@Assets["app.css"]" />
<link rel="stylesheet" href="@Assets["BlazorWeb-CSharp.styles.css"]" />

Haritaları içeri aktarma

Bu bölüm sunucu tarafı Blazor uygulamalar için geçerlidir.

bileşen, ImportMap modül betikleri için içeri aktarma eşlemesini tanımlayan bir içeri aktarma eşleme öğesini (<script type="importmap"></script>) temsil eder. BileşenImportMap, genellikle bileşen (Components/App.razor) olan kök bileşenin içeriğine App yerleştirilir<head>.

<ImportMap />

Özel bir ImportMapDefinition bileşene ImportMap atanmamışsa, içeri aktarma eşlemesi uygulamanın varlıklarına göre oluşturulur.

Aşağıdaki örneklerde özel içeri aktarma eşleme tanımları ve oluşturdukları içeri aktarma eşlemeleri gösterilmektedir.

Temel içeri aktarma haritası:

new ImportMapDefinition(
    new Dictionary<string, string>
    {
        { "jquery", "https://cdn.example.com/jquery.js" },
    },
    null,
    null);

Yukarıdaki kod aşağıdaki içeri aktarma eşlemesine neden olur:

{
  "imports": {
    "jquery": "https://cdn.example.com/jquery.js"
  }
}

Kapsamlı içeri aktarma eşlemesi:

new ImportMapDefinition(
    null,
    new Dictionary<string, IReadOnlyDictionary<string, string>>
    {
        ["/scoped/"] = new Dictionary<string, string>
        {
            { "jquery", "https://cdn.example.com/jquery.js" },
        }
    },
    null);

Yukarıdaki kod aşağıdaki içeri aktarma eşlemesine neden olur:

{
  "scopes": {
    "/scoped/": {
      "jquery": "https://cdn.example.com/jquery.js"
    }
  }
}

Haritayı bütünlükle içeri aktarma:

new ImportMapDefinition(
    new Dictionary<string, string>
    {
        { "jquery", "https://cdn.example.com/jquery.js" },
    },
    null,
    new Dictionary<string, string>
    {
        { "https://cdn.example.com/jquery.js", "sha384-abc123" },
    });

Yukarıdaki kod aşağıdaki içeri aktarma eşlemesine neden olur:

{
  "imports": {
    "jquery": "https://cdn.example.com/jquery.js"
  },
  "integrity": {
    "https://cdn.example.com/jquery.js": "sha384-abc123"
  }
}

İçeri aktarma eşleme tanımlarını (ImportMapDefinition) ile ImportMapDefinition.Combinebirleştirin.

Statik varlıkları ilgili benzersiz URL'lerine eşleyen bir ResourceAssetCollection içinden oluşturulan içeri aktarma eşlemesi:

ImportMapDefinition.FromResourceCollection(
    new ResourceAssetCollection(
    [
        new ResourceAsset(
            "jquery.fingerprint.js",
            [
                new ResourceAssetProperty("integrity", "sha384-abc123"),
                new ResourceAssetProperty("label", "jquery.js"),
            ])
    ]));

Yukarıdaki kod aşağıdaki içeri aktarma eşlemesine neden olur:

{
  "imports": {
    "./jquery.js": "./jquery.fingerprint.js"
  },
  "integrity": {
    "jquery.fingerprint.js": "sha384-abc123"
  }
}

Statik Dosya Ara Yazılımını, uygulamanın istek işleme işlem hattında arayarak UseStaticFiles istemcilere statik varlıklar sunmak üzere yapılandırın. Daha fazla bilgi için, bkz. ASP.NET Core statik dosyaları.

.NET 8 öncesi sürümlerde, Blazor betik gibi Blazor çerçeve statik dosyaları Statik Dosya Ara Yazılımı aracılığıyla sunulur. .NET 8 veya sonraki sürümlerinde, Blazor çerçeve statik dosyaları uç nokta yönlendirmesi kullanılarak eşlenir ve Statik Dosya Ara Yazılımı artık kullanılmaz.

Statik dosya `<link>` `href` biçimlerinin özeti

Bu bölüm tüm .NET sürümleri ve Blazor uygulamaları için geçerlidir.

Aşağıdaki tablolarda statik dosya <link> href biçimleri .NET sürümüne göre özetlenmiştir.

Statik dosya bağlantılarının <head> yerleştirildiği içeriğin konumu için bkz . ASP.NET Core Blazor proje yapısı. Statik varlık bağlantıları, tek tek Razor bileşenlerdeki bileşenler kullanılarak <HeadContent> da sağlanabilir.

Statik dosya bağlantılarının <head> yerleştirildiği içeriğin konumu için bkz . ASP.NET Core Blazor proje yapısı.

.NET 9 veya üzeri

Uygulama türü	`href` değer	Örnekler
Blazor Web Uygulaması	`@Assets["{PATH}"]`	`<link rel="stylesheet" href="@Assets["app.css"]" />` `<link href="@Assets["_content/ComponentLib/styles.css"]" rel="stylesheet" />`
Blazor Server†	`@Assets["{PATH}"]`	`<link href="@Assets["css/site.css"]" rel="stylesheet" />` `<link href="@Assets["_content/ComponentLib/styles.css"]" rel="stylesheet" />`
Tek başına Blazor WebAssembly	`{PATH}`	`<link rel="stylesheet" href="css/app.css" />` `<link href="_content/ComponentLib/styles.css" rel="stylesheet" />`

.NET 8.x

Uygulama türü	`href` değer	Örnekler
Blazor Web Uygulaması	`{PATH}`	`<link rel="stylesheet" href="app.css" />` `<link href="_content/ComponentLib/styles.css" rel="stylesheet" />`
Blazor Server†	`{PATH}`	`<link href="css/site.css" rel="stylesheet" />` `<link href="_content/ComponentLib/styles.css" rel="stylesheet" />`
Tek başına Blazor WebAssembly	`{PATH}`	`<link rel="stylesheet" href="css/app.css" />` `<link href="_content/ComponentLib/styles.css" rel="stylesheet" />`

.NET 7.x veya öncesi

Uygulama türü	`href` değer	Örnekler
Blazor Server†	`{PATH}`	`<link href="css/site.css" rel="stylesheet" />` `<link href="_content/ComponentLib/styles.css" rel="stylesheet" />`
Barındırılan Blazor WebAssembly‡	`{PATH}`	`<link href="css/app.css" rel="stylesheet" />` `<link href="_content/ComponentLib/styles.css" rel="stylesheet" />`
Blazor WebAssembly	`{PATH}`	`<link href="css/app.css" rel="stylesheet" />` `<link href="_content/ComponentLib/styles.css" rel="stylesheet" />`

Blazor Server† .NET 8 veya sonraki sürümlerinde desteklenir, ancak artık .NET 7'nin ardından bir proje şablonu değildir.
‡.NET 8 veya üzerini benimserken Barındırılan Blazor WebAssembly uygulamaları Web Apps'e Blazor güncelleştirmenizi öneririz.

Statik Web Varlığı Proje Modu

Bu bölüm bir Blazor Web Uygulamasının .Client projesi için geçerlidir.

Web Uygulamasının Blazor projesinde .Client gerekli <StaticWebAssetProjectMode>Default</StaticWebAssetProjectMode> ayar, statik varlık davranışlarını varsayılan değerlere geri döndürerek Blazor WebAssembly projenin barındırılan projenin bir parçası olarak davranmasını sağlar. Blazor WebAssembly SDK (Microsoft.NET.Sdk.BlazorWebAssembly), statik web varlıklarını yalnızca kitaplıktaki çıkışları kullanan bir sunucuyla "tek başına" modda çalışacak şekilde yapılandırır. Bu, uygulamanın WebAssembly bölümünün konağın mantıksal bir parçası olduğu ve daha çok kitaplık gibi davranması gereken bir Web Uygulaması için Blazor uygun değildir. Örneğin, proje stiller paketini (örneğin, BlazorSample.Client.styles.css) kullanıma sunmaz ve konağın kendi stil paketine ekleyebilmesi için konağa yalnızca proje paketini sağlar.

özelliğinin (Default) değerinin <StaticWebAssetProjectMode> değiştirilmesi veya özelliğin .Client projeden kaldırılması desteklenmez .

Ortamlarda olmayan`Development` statik dosyalar

Bu bölüm sunucu tarafı statik dosyaları için geçerlidir.

Bir uygulamayı yerel olarak çalıştırırken, statik web varlıkları yalnızca ortamda varsayılan olarak Development etkinleştirilir. Yerel geliştirme ve test dışındaki ortamlar Development için statik dosyaları etkinleştirmek için (örneğin, Staging), dosyasında öğesini çağırın WebApplicationBuilder UseStaticWebAssets Program.

Uyarı

Üretim ortamında çağrılırsa proje dışında diskteki ayrı konumlardan dosyalara hizmet vermesinden dolayı, üretim ortamında özelliğin etkinleştirilmesini önlemek için tam ortamı çağırınUseStaticWebAssets. Bu bölümdeki örnek, çağırarak IsStagingortamı denetlerStaging.

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

Varlıklar için Blazor WebAssembly ön ek

Bu bölüm Web Apps için Blazor geçerlidir.

Varlıkların WebAssemblyComponentsEndpointOptions.PathPrefix ön ekini gösteren yol dizesini ayarlamak için Blazor WebAssembly uç nokta seçeneğini kullanın. Yol, başvuruda bulunan Blazor WebAssembly bir uygulama projesine karşılık gelir.

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

Yukarıdaki örnekte yer {PATH PREFIX} tutucu yol ön ekidir ve eğik çizgi (/ ) ile başlamalıdır.

Aşağıdaki örnekte yol ön eki olarak /path-prefixayarlanmıştır:

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

Statik web varlığı temel yolu

Bu bölüm tek başına Blazor WebAssembly uygulamalar için geçerlidir.

Varsayılan olarak, uygulamayı yayımlamak, uygulamanın çerçeve dosyaları (_frameworkklasör varlıkları) dahil olmak üzere Blazor statik varlıklarını yayımlanan çıktıdaki kök yola (/) yerleştirir. <StaticWebAssetBasePath> Proje dosyasında (.csproj) belirtilen özellik, temel yolu kök olmayan bir yola ayarlar:

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

Yukarıdaki örnekte yer {PATH} tutucu yoldur.

özelliği ayarlanmadan <StaticWebAssetBasePath> , tek başına bir uygulama konumunda /BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/yayımlanır.

Yukarıdaki örnekte yer {TFM} tutucu Hedef Çerçeve Takma Adıdır (örneğin, net6.0TFM).

<StaticWebAssetBasePath> Tek başına Blazor WebAssembly bir uygulamadaki özellik yayımlanan statik varlık yolunu olarak app1ayarlarsa, yayımlanan çıktıda uygulamanın kök yolu olur/app1.

Tek başına Blazor WebAssembly uygulamanın proje dosyasında (.csproj):

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

Yayımlanan çıktıda, tek başına Blazor WebAssembly uygulamanın yolu şeklindedir /BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/app1/.

Yukarıdaki örnekte yer {TFM} tutucu Hedef Çerçeve Takma Adıdır (örneğin, net6.0TFM).

Bu bölüm, tek başına Blazor WebAssembly uygulamalar ve barındırılan Blazor WebAssembly çözümler için geçerlidir.

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

Yukarıdaki örnekte yer {PATH} tutucu yoldur.

Özelliği ayarlanmadan, barındırılan <StaticWebAssetBasePath> bir çözümün veya tek başına bir uygulamanın istemci uygulaması aşağıdaki yollarda yayımlanır:

Barındırılan Server Blazor WebAssembly çözümün projesinde: /BlazorHostedSample/Server/bin/Release/{TFM}/publish/wwwroot/
Tek başına Blazor WebAssembly bir uygulamada: /BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/

Barındırılan <StaticWebAssetBasePath> Blazor WebAssembly bir uygulamanın projesindeki Client veya tek başına Blazor WebAssembly bir uygulamadaki özelliği yayımlanan statik varlık yolunu olarak app1ayarlarsa, yayımlanan çıktıda uygulamanın kök yolu olur/app1.

Client Uygulamanın proje dosyasında (.csproj) veya tek başına Blazor WebAssembly uygulamanın proje dosyasında (.csproj):

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

Yayımlanan çıktıda:

Barındırılan Blazor WebAssembly çözüm projesindeki Server istemci uygulamasının yolu:/BlazorHostedSample/Server/bin/Release/{TFM}/publish/wwwroot/app1/
Tek başına Blazor WebAssembly bir uygulamanın yolu: /BlazorStandaloneSample/bin/Release/{TFM}/publish/wwwroot/app1/

<StaticWebAssetBasePath> özelliği en yaygın olarak tek bir barındırılan dağıtımda birden çok Blazor WebAssembly uygulamanın yayımlanmış statik varlıklarının yollarını denetlemek için kullanılır. Daha fazla bilgi için bkz . Birden çok barındırılan ASP.NET Core Blazor WebAssembly uygulaması. Özelliği tek başına Blazor WebAssembly uygulamalarda da etkilidir.

Yukarıdaki örneklerde yer {TFM} tutucu Hedef Çerçeve Takma Adıdır (örneğin, net6.0TFM).

Dosya eşlemeleri ve statik dosya seçenekleri

Bu bölüm sunucu tarafı statik dosyaları için geçerlidir.

ile ek dosya eşlemeleri oluşturmak veya diğerini FileExtensionContentTypeProvider StaticFileOptionsyapılandırmak için aşağıdaki yaklaşımlardan birini kullanın. Aşağıdaki örneklerde yer {EXTENSION} tutucu dosya uzantısı {CONTENT TYPE} , yer tutucu ise içerik türüdür. Aşağıdaki API'nin ad alanı şeklindedir Microsoft.AspNetCore.StaticFiles.

kullanarak StaticFileOptionsdosyaya Program bağımlılık ekleme (DI) aracılığıyla seçenekleri yapılandırın:

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

builder.Services.Configure<StaticFileOptions>(options =>
{
    options.ContentTypeProvider = provider;
});

app.UseStaticFiles();

dosyasını StaticFileOptions doğrudan UseStaticFiles Program dosyasına geçirin:

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

app.UseStaticFiles(new StaticFileOptions { ContentTypeProvider = provider });

kullanarak StaticFileOptionsdosyaya Program bağımlılık ekleme (DI) aracılığıyla seçenekleri yapılandırın:
```
using Microsoft.AspNetCore.StaticFiles;

...

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

builder.Services.Configure<StaticFileOptions>(options =>
{
    options.ContentTypeProvider = provider;
});
```
Bu yaklaşım, betiği sunmak için kullanılan dosya sağlayıcısını yapılandırıyor Blazor . Özel yapılandırmanızın betiğin sunulmasını Blazor engellemediğinden emin olun. Örneğin, sağlayıcıyı ile provider.Mappings.Remove(".js")yapılandırarak JavaScript dosyaları için eşlemeyi kaldırmayın.
Dosyasında için UseStaticFiles Program iki çağrı kullanın:
- ile StaticFileOptionsilk çağrıda özel dosya sağlayıcısını yapılandırın.
- İkinci ara yazılım, çerçeve tarafından Blazor sağlanan varsayılan statik dosyalar yapılandırmasını kullanan betiği sağlarBlazor.
```
using Microsoft.AspNetCore.StaticFiles;

...

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

app.UseStaticFiles(new StaticFileOptions { ContentTypeProvider = provider });
app.UseStaticFiles();
```

Özel bir Statik Dosya Ara Yazılımı yürütmek için kullanarak MapWhen hizmet _framework/blazor.server.js verme işlemini engellemeyi önleyebilirsiniz:

app.MapWhen(ctx => !ctx.Request.Path
    .StartsWithSegments("/_framework/blazor.server.js"),
        subApp => subApp.UseStaticFiles(new StaticFileOptions() { ... }));

Dosyaları birden çok konumdan sunma

Bu bölümdeki yönergeler yalnızca Web Apps için Blazor geçerlidir.

Ile birden çok konumdan CompositeFileProviderdosya sunmak için:

ad Microsoft.Extensions.FileProviders alanını sunucu projesinin dosyasının Program en üstüne ekleyin.
çağrısından önce sunucu projesinin Program dosyasında:UseStaticFiles
- Statik varlıkların yolu ile bir PhysicalFileProvider oluşturun.
- ve PhysicalFileProviderkaynaklarından WebRootFileProvider bir CompositeFileProvider oluşturun. Bileşik dosya sağlayıcısını uygulamanın öğesine geri atayın WebRootFileProvider.

Örnek:

Sunucu projesinde adlı AdditionalStaticAssetsyeni bir klasör oluşturun. Klasöre bir görüntü yerleştirin.

Sunucu projesi Program dosyasının en üstüne aşağıdaki using deyimi ekleyin:

using Microsoft.Extensions.FileProviders;

çağrısından UseStaticFilesönce sunucu projesinin Program dosyasına aşağıdaki kodu ekleyin:

var secondaryProvider = new PhysicalFileProvider(
    Path.Combine(builder.Environment.ContentRootPath, "AdditionalStaticAssets"));
app.Environment.WebRootFileProvider = new CompositeFileProvider(
    app.Environment.WebRootFileProvider, secondaryProvider);

Uygulamanın Home bileşen (Home.razor) işaretlemesinde resme bir <img> etiketle başvurun:

<img src="{IMAGE FILE NAME}" alt="{ALT TEXT}" />

Yukarıdaki örnekte:

Yer {IMAGE FILE NAME} tutucu, görüntü dosyası adıdır. Görüntü dosyası klasörün kökündeyse AdditionalStaticAssets yol kesimi sağlamaya gerek yoktur.
Yer {ALT TEXT} tutucu, resim alternatif metnidir.

Uygulamayı çalıştırma.

Aracılığıyla paylaş

ASP.NET Core Blazor statik dosyaları

Statik varlık ara yazılımı

Statik Dosya Ara Yazılımını Eşleme ile varlıkları kullanma

Haritaları içeri aktarma

Statik dosya `<link>` `href` biçimlerinin özeti

.NET 9 veya üzeri

.NET 8.x

.NET 7.x veya öncesi

Statik Web Varlığı Proje Modu

Ortamlarda olmayan`Development` statik dosyalar

Varlıklar için Blazor WebAssembly ön ek

Statik web varlığı temel yolu

Dosya eşlemeleri ve statik dosya seçenekleri

Dosyaları birden çok konumdan sunma

Ek kaynaklar

Ek kaynaklar

Aracılığıyla paylaş

ASP.NET Core Blazor statik dosyaları

Statik varlık ara yazılımı

Statik Dosya Ara Yazılımını Eşleme ile varlıkları kullanma

Haritaları içeri aktarma

Statik dosya <link> href biçimlerinin özeti

.NET 9 veya üzeri

.NET 8.x

.NET 7.x veya öncesi

Statik Web Varlığı Proje Modu

Ortamlarda olmayanDevelopment statik dosyalar

Varlıklar için Blazor WebAssembly ön ek

Statik web varlığı temel yolu

Dosya eşlemeleri ve statik dosya seçenekleri

Dosyaları birden çok konumdan sunma

Ek kaynaklar

Ek kaynaklar

Statik dosya `<link>` `href` biçimlerinin özeti

Ortamlarda olmayan`Development` statik dosyalar