ASP.NET Core Blazor barındırma ve dağıtma

Bu makalede Blazor uygulamalarını barındırma ve dağıtma açıklanmaktadır.

Uygulamayı yayımlayın

Uygulamalar, Sürüm yapılandırmasında dağıtım için yayımlanır.

Visual Studio

1. Uygulama adının yer tutucusunun bulunduğu {APPLICATION} Oluştur menüsünden Yayımla {APPLICATION} komutunu seçin.
2. Yayımlama hedefini seçin. Yerel olarak yayımlamak için Klasör’ü seçin.
3. Klasör seçin alanında varsayılan konumu kabul edin veya farklı bir konum belirtin. Publish düğmesini seçin.

.NET Core CLI

Uygulamayı Sürüm yapılandırmasıyla yayımlamak için dotnet publish komutunu kullanın:

dotnet publish -c Release

Uygulamanın yayımlanması, projenin bağımlılıklarının geri yüklenmesini tetikler ve dağıtım için varlıkları oluşturmadan önce projeyi derler. Derleme işleminin bir parçası olarak, uygulama indirme boyutunu ve yükleme sürelerini azaltmak için kullanılmayan yöntemler ve derlemeler kaldırılır.

Yayımlama konumları:

• Blazor Web Uygulaması: Varsayılan olarak, uygulama klasörde yayımlanır /bin/Release/{TARGET FRAMEWORK}/publish . publish klasörünün içeriğini konağa dağıtın.
• Blazor WebAssembly: Varsayılan olarak, uygulama klasörde yayımlanır bin\Release\net8.0\browser-wasm\publish\ . Uygulamayı statik site olarak dağıtmak için wwwroot klasörünün içeriğini statik site konağına kopyalayın.

{TARGET FRAMEWORK} Yukarıdaki yollardaki hedef çerçevedir (örneğin, net8.0).

IIS

IIS'de bir Blazor uygulama barındırmak için aşağıdaki kaynaklara bakın:

• IIS barındırma
  • ASP.NET Core uygulamasını IIS'de yayımlama
  • IIS ile Windows'da ASP.NET Core'u barındırma
• ASP.NET Core sunucu tarafı Blazor uygulamalarını barındırın ve dağıtın: Windows işletim sistemi ve Azure Uygulaması Hizmeti çalıştıran Azure Sanal Makineler (VM) ile IIS de dahil olmak üzere IIS üzerinde çalışan sunucu uygulamaları.
• ASP.NET Core'u Blazor WebAssemblybarındırma ve dağıtma: Statik site barındırma, özel web.config dosyalar, URL yeniden yazma, alt uygulamalar, sıkıştırma ve Azure Depolama statik dosya barındırma gibi IIS'de barındırılan uygulamalar için Blazor WebAssembly ek yönergeler içerir.
• IIS alt uygulama barındırma
  • Uygulamayı yayımlamadan önce uygulamanın Uygulama temel yolu bölümündeki Blazor yönergeleri izleyin. Örneklerde uygulamasının /CoolApp temel yolu kullanılır ve temel yolun uygulama ayarlarından veya diğer yapılandırma sağlayıcılarından nasıl elde edileceğini gösterir.
  • Gelişmiş yapılandırma'daki alt uygulama yapılandırma yönergelerini izleyin. Alt uygulamanın kök site altındaki klasör yolu, alt uygulamanın sanal yolu olur. uygulamasının /CoolAppBlazor uygulama temel yolu için, uygulama kök sitenin altında adlı CoolApp bir klasöre yerleştirilir ve alt uygulama sanal yolunu /CoolAppizler.

Blazor uygulamaları dahil olmak üzere ASP.NET Core uygulamaları arasında uygulama havuzunun paylaşılması desteklenmez. IIS ile barındırırken uygulama başına bir uygulama havuzu kullanın ve birden çok uygulama barındırmak için IIS'nin sanal dizinlerini kullanmaktan kaçının.

Uygulama temel yolu

Uygulama temel yolu, uygulamanın kök URL yoludur. Uygulamalarda başarılı yönlendirme Blazor , varsayılan uygulama temel /yolunda olmayan tüm kök URL yolları için çerçeve yapılandırması gerektirir.

Aşağıdaki ASP.NET Core uygulamasını ve Blazor alt uygulamasını göz önünde bulundurun:

• ASP.NET Core uygulamasının adı MyApp:
  • Uygulama fiziksel olarak d:/MyApp konumunda bulunur.
  • İstekler https://www.contoso.com/{MYAPP RESOURCE} adresinden alınır.
• Blazor adlı CoolApp bir uygulama, uygulamasının alt uygulamasıdırMyApp:
  • Alt uygulama fiziksel olarak d:/MyApp/CoolApp konumunda bulunur.
  • İstekler https://www.contoso.com/CoolApp/{COOLAPP RESOURCE} adresinden alınır.

CoolApp için ek yapılandırma belirtilmeden, bu senaryodaki alt uygulamanın sunucuda nerede bulunduğu hakkında hiçbir bilgisi yoktur. Örneğin uygulama, göreli /CoolApp/ URL yolunda bulunduğunu bilmeden kaynaklarına doğru göreli URL'ler üretemez. Bu senaryo, bir uygulama kök URL yolunda barındırılmıyorsa çeşitli barındırma ve ters ara sunucu senaryolarında da geçerlidir.

Background

Yer işareti etiketinin hedefi (href) iki uç noktadan biriyle oluşturulabilir:

• Bir düzen (atlanırsa varsayılan olarak sayfanın düzenine), konak, bağlantı noktası ve yol ya da yalnızca eğik çizgi (/) ve ardından yol içeren mutlak konumlar.

  Örnekler: https://example.com/a/b/c veya /a/b/c

• Yalnızca bir yol içeren ve eğik çizgi (/) ile başlamayan göreli konumlar. Bunlar, belirtilmişse geçerli belge URL'sine veya etiketin <base> değerine göre çözümlenir.

  Örnek: a/b/c

Yapılandırılmış bir uygulama temel yolunda sondaki eğik çizginin (/) varlığı, uygulamanın URL'lerinin temel yolunu hesaplamak için önemlidir. Örneğin, https://example.com/a temel yolu https://example.com/olurken https://example.com/a/ , sondaki eğik çizginin temel yolu https://example.com/avardır.

ASP.NET Core uygulamalarında ilgili üç bağlantı Blazor kaynağı vardır:

• Bileşenlerdeki Razor (.razor) URL'ler genellikle görelidir.
• Betikler () gibi betiklerdeki Blazorblazor.*.jsURL'ler belgeye göre belirlenir.

Farklı belgelerden (örneğin ve /Admin/D/E/) bir Blazor uygulama işleniyorsa, /Admin/B/C/ uygulama temel yolunu hesaba katmalısınız, aksi takdirde uygulama her belgede işlendiğinde ve kaynaklar yanlış URL'lerden getirildiğinde temel yol farklıdır.

Göreli bağlantıları doğru çözümlemenin zorluğuyla başa çıkmak için iki yaklaşım vardır:

• Kök olarak işlendikleri belgeyi kullanarak kaynakları dinamik olarak eşleyin.
• Belge için tutarlı bir temel yol ayarlayın ve kaynakları bu temel yol altında eşleyin.

her belge için gezintiyi farklı hale getirdiğinden ilk seçenek daha karmaşıktır ve en tipik yaklaşım değildir. Bir sayfayı /Something/Elseişlemek için aşağıdaki örneği göz önünde bulundurun:

• altında /Admin/B/C/işlenir, sayfa bir yolu /Admin/B/C/Something/Elseile işlenir.
• altında /Admin/D/E/işlenir, sayfa ile aynı yolda/Admin/B/C/Something/Else işlenir.

İlk yaklaşımda, yönlendirme teklifleri IDynamicEndpointMetadata ve MatcherPolicyile birlikte, çalışma zamanında isteklerin nasıl yönlendirildiğine karar veren tamamen dinamik bir çözüm uygulamak için temel olabilir.

Uygulama, her zamanki yaklaşım olan ikinci seçenek için belgedeki temel yolu ayarlar ve sunucu uç noktalarını taban altındaki yollara eşler. Aşağıdaki kılavuz bu yaklaşımı benimser.

Sunucu tarafı Blazor

Dosyasının SignalR yolunu MapBlazorHub geçirerek sunucu tarafı Blazor uygulamasının hub'ını eşleyinProgram:

app.MapBlazorHub("base/path");

Kullanmanın MapBlazorHub avantajı, yalnızca somut yollar gibi değil, desenleri "{tenant}" eşleyebilirsiniz.

Ayrıca uygulama dallandırılmış ara yazılım işlem hattına sahip bir sanal klasördeyken hub'ı eşleyebilirsinizSignalR. Aşağıdaki örnekte, istekleri /base/path/ 'nin hub'ı SignalR tarafından Blazorişlenir:

app.Map("/base/path/", subapp => {
    subapp.UsePathBase("/base/path/");
    subapp.UseRouting();
    subapp.UseEndpoints(endpoints => endpoints.MapBlazorHub());
});

<base> Etiketi, Uygulama temel yolunu yapılandırma bölümündeki yönergelere göre yapılandırın.

Bağımsız Blazor WebAssembly

Tek başına Blazor WebAssembly bir uygulamada, Uygulama temel yolunu yapılandırma bölümündeki yönergelere göre yalnızca <base> etiket yapılandırılır.

Uygulama temel yolunu yapılandırma

Uygulamanın temel yolu için yapılandırma sağlamak için Blazor , göreli kök yol https://www.contoso.com/CoolApp/olarak da adlandırılan uygulama temel yolunu ayarlayın.

Uygulama temel yolunu yapılandırarak, kök dizinde olmayan bir bileşen uygulamanın kök yoluna göre URL'ler oluşturabilir. Dizin yapısının farklı düzeylerindeki bileşenler, uygulama genelindeki konumlarda diğer kaynaklara bağlantılar oluşturabilir. Uygulama temel yolu, bağlantının href hedefinin uygulama temel yolu URI alanı içinde olduğu seçili köprüleri kesmek için de kullanılır. Bileşen iç Router gezintiyi işler.

Birçok barındırma senaryosunda, uygulamanın göreli URL yolu uygulamanın köküdür. Bu varsayılan durumlarda, uygulamanın göreli URL temel yolu içerikte<head> olduğu gibi <base href="/" /> yapılandırılır./

Not

GitHub Sayfaları ve IIS alt uygulamaları gibi bazı barındırma senaryolarında, uygulama temel yolu sunucunun uygulamanın göreli URL yoluna ayarlanmalıdır.

• Sunucu tarafı Blazor bir uygulamada aşağıdaki yaklaşımlardan birini kullanın:

  • 1. Seçenek: Uygulamanın temel yolunu (içerik konumu<head>) ayarlamak için etiketini kullanın<base>:

    <base href="/CoolApp/">
    

    Sondaki eğik çizgi gereklidir.

  • 2. Seçenek: uygulamanın istek işleme işlem hattında () oluşturulduktan hemen sonra () ilk çağrısı UsePathBaseyapın vebuilder.Build() istek yoluyla etkileşim kuran aşağıdaki ara yazılımların temel yolunu yapılandırın:Program.csWebApplicationBuilder

    app.UsePathBase("/CoolApp");
    

    Uygulamayı yerel olarak çalıştırmak Blazor Server istediğinizde de UsePathBase çağırmanız önerilir. Örneğin, başlatma URL'sini Properties/launchSettings.json içinde sağlayın:

    "launchUrl": "https://localhost:{PORT}/CoolApp",
    

    Yukarıdaki örnekte {PORT} yer tutucusu, applicationUrl yapılandırma yolundaki güvenli bağlantı noktasıyla eşleşen bağlantı noktasıdır. Aşağıdaki örnek, 7279 numaralı bağlantı noktasındaki bir uygulamanın tam başlatma profilini gösterir:

    "BlazorSample": {
      "commandName": "Project",
      "dotnetRunMessages": true,
      "launchBrowser": true,
      "applicationUrl": "https://localhost:7279;http://localhost:5279",
      "launchUrl": "https://localhost:7279/CoolApp",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
    }
    

    Dosya hakkında launchSettings.json daha fazla bilgi için bkz . ASP.NET Core'da birden çok ortam kullanma. Uygulama temel yolları ve barındırma hakkında Blazor ek bilgi için bkz<base href="/" />. veya MVC tümleştirmesi için Blazor temel etiket alternatifi (dotnet/aspnetcore #43191).

• Tek başına Blazor WebAssembly (wwwroot/index.html):

  <base href="/CoolApp/">
  

  Sondaki eğik çizgi gereklidir.

Not

kullanırken WebApplication (bkz . ASP.NET Core 5.0'dan 6.0'a geçiş), app.UseRouting yönlendirme ara yazılımının yolları eşleştirmeden önce değiştirilen yolu gözlemlemesi için bundan sonra UsePathBase çağrılmalıdır. Aksi takdirde yollar, Ara Yazılım Sıralama ve Yönlendirme makalelerinde açıklandığı gibi UsePathBase tarafından yollar yeniden yazmadan önce eşleştirilir.

Uygulama genelinde bağlantıları eğik çizgiyle önek eklemeyin. Yol kesimi ayırıcısı kullanmaktan kaçının veya nokta-eğik çizgi (./) göreli yol gösterimini kullanın:

• ❌ Yanlış: <a href="/account">
• ✔️ Doğru: <a href="account">
• ✔️ Doğru: <a href="./account">

HttpClient hizmeti ile birlikte Blazor WebAssembly web API’si isteklerinde, JSON yardımcılarının (HttpClientJsonExtensions) URL'lerin önüne eğik çizgi (/) eklemediğini onaylayın:

• ❌ Yanlış: var rsp = await client.GetFromJsonAsync("/api/Account");
• ✔️ Doğru: var rsp = await client.GetFromJsonAsync("api/Account");

Gezinti Yöneticisi göreli bağlantılarının önüne eğik çizgi eklemeyin. Yol kesim ayırıcısı kullanmaktan kaçının veya nokta eğik çizgi (./) göreli yol gösterimi kullanın (Navigation eklenen NavigationManagerbir ):

• ❌ Yanlış: Navigation.NavigateTo("/other");
• ✔️ Doğru: Navigation.NavigateTo("other");
• ✔️ Doğru: Navigation.NavigateTo("./other");

Azure/IIS barındırma için tipik yapılandırmalarda, genellikle ek yapılandırma gerekli değildir. IIS dışı bazı barındırma ve ters ara sunucu barındırma senaryolarında ek Statik Dosya Ara Yazılım yapılandırması gerekebilir:

• Statik dosyaları doğru bir şekilde sunmak için (örneğin, app.UseStaticFiles("/CoolApp");).
• Betiği (_framework/blazor.*.js) sunmak Blazor için. Daha fazla bilgi için, bkz. ASP.NET CoreBlazor statik dosyaları.

Kök olmayan göreli URL yolu olan bir Blazor WebAssembly uygulaması için (örneğin, <base href="/CoolApp/">), uygulama yerel olarak çalıştırıldığında kaynaklarını bulamıyor. Yerel geliştirme ve test sırasında bu sorunun üstesinden gelmek için, çalışma zamanında <base> etiketinin href değeriyle eşleşen bir yol temeli bağımsız değişkeni sağlayabilirsiniz. Sondaki eğik çizgiyi eklemeyin. Uygulamayı yerel olarak çalıştırırken yol temeli bağımsız değişkenini geçirmek için, dotnet run komutu uygulamanın dizininden --pathbase seçeneği ile yürütebilirsiniz:

dotnet run --pathbase=/{RELATIVE URL PATH (no trailing slash)}

/CoolApp/ (<base href="/CoolApp/">) öğesinin göreli URL yolu ile bir Blazor WebAssembly uygulaması için, komut:

dotnet run --pathbase=/CoolApp

Uygulamanın başlatma profilini pathbaseel ile değil otomatik olarak dotnet run şeklinde yapılandırmayı tercih ederseniz, commandLineArgs özelliğini Properties/launchSettings.json içinde ayarlayın. Aşağıda başlatma URL'si (launchUrl) de yapılandırılır:

"commandLineArgs": "--pathbase=/{RELATIVE URL PATH (no trailing slash)}",
"launchUrl": "{RELATIVE URL PATH (no trailing slash)}",

Örnek olarak CoolApp kullanmak :

"commandLineArgs": "--pathbase=/CoolApp",
"launchUrl": "CoolApp",

dotnet run öğesini --pathbase seçeneğiyle veya temel yolu ayarlayan bir başlatma profili yapılandırmasıyla kullanarak, Blazor WebAssembly uygulaması yerel olarak http://localhost:port/CoolApp öğesinde yanıt verir.

Dosya hakkında launchSettings.json daha fazla bilgi için bkz . ASP.NET Core'da birden çok ortam kullanma. Uygulama temel yolları ve barındırma hakkında Blazor ek bilgi için bkz<base href="/" />. veya MVC tümleştirmesi için Blazor temel etiket alternatifi (dotnet/aspnetcore #43191).

Yapılandırmadan uygulama temel yolunu alma

Aşağıdaki kılavuzda, etiketin yolunun farklı ortamlar için <base> bir uygulama ayarları dosyasından nasıl alınacakları açıklanmaktadır.

Uygulama ayarları dosyasını uygulamaya ekleyin. Aşağıdaki örnek, ortam içindir Staging (appsettings.Staging.json):

{
  "AppBasePath": "staging/"
}

Sunucu tarafı Blazor bir uygulamada, içerikteki <head>yapılandırmadan temel yolu yükleyin:

@inject IConfiguration Config

...

<head>
    ...
    <base href="/@(Config.GetValue<string>("AppBasePath"))" />
    ...
</head>

Alternatif olarak, sunucu tarafı bir uygulama için UsePathBaseyapılandırmadan değerini alabilir. Aşağıdaki kodu uygulamanın istek işleme işlem hattına (Program.cs) oluşturulduktan hemen sonra WebApplicationBuilder (builder.Build()) yerleştirin. Aşağıdaki örnekte yapılandırma anahtarı AppBasePathkullanılır:

app.UsePathBase($"/{app.Configuration.GetValue<string>("AppBasePath")}");

İstemci tarafı Blazor WebAssembly uygulamasında:

• <base> etiketinden wwwroot/index.htmlkaldırın:

  - <base href="..." />
  

• Uygulama temel yolunu bileşendeki App bir HeadContent bileşen aracılığıyla sağlayın (App.razor):

  @inject IConfiguration Config
  
  ...
  
  <HeadContent>
      <base href="/@(Config.GetValue<string>("AppBasePath"))" />
  </HeadContent>
  

Yüklenecek yapılandırma değeri yoksa (örneğin hazırlama dışı ortamlarda), yukarıdaki href çözüm kök yoluna /gider.

Bu bölümdeki örnekler, uygulama ayarlarından uygulama temel yolunu sağlama konusuna odaklanır, ancak yolu IConfiguration okuma yaklaşımı tüm yapılandırma sağlayıcıları için geçerlidir. Daha fazla bilgi edinmek için aşağıdaki kaynaklara bakın:

• ASP.NET Core Blazor yapılandırma
• ASP.NET Core'da yapılandırma

Blazor ServerMapFallbackToPage yapılandırması

Bu bölüm yalnızca uygulamalar için Blazor Server geçerlidir. MapFallbackToPageWeb Apps ve Blazor WebAssembly uygulamalarda desteklenmezBlazor.

Bir uygulamanın özel kaynaklara ve Razor bileşenlerine sahip ayrı bir alan gerektirdiği senaryolarda:

• Kaynakları tutmak için uygulamanın Pages klasöründe bir klasör oluşturun. Örneğin, bir uygulamanın yönetici bölümü Admin (Pages/Admin) adlı yeni bir klasörde oluşturulur.

• Alan için bir kök sayfa (_Host.cshtml) oluşturun. Örneğin, uygulamanın ana kök sayfasından (Pages/_Host.cshtml) bir Pages/Admin/_Host.cshtml dosyası oluşturun. Yönetici _Host sayfasında @page yönergesi sağlama.

• Alanın klasörüne bir düzen ekleyin (örneğin, Pages/Admin/_Layout.razor). Ayrı alanın düzeninde <base> etiketini alanın klasörüyle eşleşecek şekilde href olarak ayarlayın (örneğin, <base href="/Admin/" />). Tanıtım amacıyla, sayfadaki statik kaynaklara ~/ ekleyin. Örneğin:

  • ~/css/bootstrap/bootstrap.min.css
  • ~/css/site.css
  • ~/BlazorSample.styles.css (BlazorSample, örnek uygulamanın ad alanıdır)
  • ~/_framework/blazor.server.js (Blazor betiği)

• Alanın kendi statik varlık klasörü olması gerekiyorsa, klasörü ekleyin ve Program.cs içinde Statik Dosya Ara Yazılımına (örneğin, app.UseStaticFiles("/Admin/wwwroot")) konumu belirtin.

• Razor bileşenler, alanın klasörüne eklenir. En azından, alan klasörüne alan için doğru @page yönergesine sahip bir Index bileşeni ekleyin. Örneğin, uygulamanın varsayılan Pages/Index.razor dosyasını temel alan bir Pages/Admin/Index.razor dosyası ekleyin. Yönetici alanını dosyanın (@page "/admin") en üstünde yol şablonu olarak belirtin. Gerekirse ek bileşenler ekleyin. Örneğin, @page yönergesi ve @page "/admin/component1 yol şablonuna sahip Pages/Admin/Component1.razor.

• Program.cs içinde, _Host sayfasının geri dönüş kök sayfası yolundan hemen önce alanın istek yolu için MapFallbackToPage çağırın:

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

Dağıtım

Dağıtım kılavuzu için aşağıdaki konulara bakın:

• ASP.NET Core Blazor WebAssembly barındırma ve dağıtma
• ASP.NET Core sunucu tarafı Blazor uygulamaları barındırma ve dağıtma