Aracılığıyla paylaş

ASP.NET Çekirdek Blazor genelleştirme ve yerelleştirme

  • Makale

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, farklı kültür ve dillerdeki kullanıcılara genelleştirilmiş ve yerelleştirilmiş içeriğin nasıl işlenip işlendiği açıklanmaktadır.

Genelleştirme ve yerelleştirme

Genelleştirme için sayı Blazor ve tarih biçimlendirmesi sağlar. Yerelleştirme için içeriği Blazor .NET Kaynakları sistemini kullanarak işler.

ASP.NET Core'un yerelleştirme özelliklerinin sınırlı bir kümesi desteklenir:

IStringLocalizer ve IStringLocalizer<T> uygulamalarda desteklenir Blazor .

, ve Veri Ek Açıklamaları yerelleştirmesi ASP.NET Temel MVC özellikleridir ve uygulamalarda desteklenmezBlazor.IViewLocalizerIHtmlLocalizer

Bu makalede, 'nin genelleştirme ve yerelleştirme özelliklerinin aşağıdakilere göre nasıl kullanılacağı Blazoraçıklanmaktadır:

Ek genel bilgiler için aşağıdaki kaynaklara bakın:

Genelleştirme ve yerelleştirme kavramlarıyla ilgilenirken dil ve kültür terimleri genellikle birbirinin yerine kullanılır.

Bu makalede dil, bir kullanıcının tarayıcı ayarlarında yaptığı seçimleri ifade eder. Kullanıcının dil seçimleri, üst bilgideki tarayıcı isteklerinde Accept-Language gönderilir. Tarayıcı ayarları genellikle kullanıcı arabiriminde "dil" sözcüğünü kullanır.

Kültür , .NET ve Blazor API üyeleriyle ilgili. Örneğin, kullanıcının isteği, kullanıcının perspektifinden bir dil belirten üst bilgiyi içerebilirAccept-Language, ancak uygulama sonunda kullanıcının istediği dilden ("kültür") özelliğini ayarlarCurrentCulture. API genellikle üye adlarında "kültür" sözcüğünü kullanır.

Bu makaledeki kılavuzda, accessiblity araçlarının kullandığı sayfanın HTML dil özniteliğinin ()<html lang="..."> ayarlanması ele alınmıyor. Etiketin özniteliğine <html> veya document.documentElement.lang JavaScript'te bir dil lang atayarak değeri statik olarak ayarlayabilirsiniz. değerini document.documentElement.lang birlikte çalışma ile JS dinamik olarak ayarlayabilirsiniz.

Not

Bu makaledeki kod örnekleri, .NET 6 veya sonraki sürümlerindeki ASP.NET Core'da desteklenen null atanabilir başvuru türlerini (NTS) ve .NET derleyici null durum statik analizini benimser. Core 5.0 veya önceki ASP.NET hedeflerken, makalenin örneklerinden null tür atamasını (?) kaldırın.

Globalleştirme

öznitelik yönergesi @bind , uygulamanın desteklediği ilk tercih edilen dile göre görüntüleme için biçimler uygular ve değerleri ayrıştırmaktadır. @bind@bind:culture bir değeri ayrıştırmak ve biçimlendirmek için parametresini System.Globalization.CultureInfo destekler.

Geçerli kültüre özelliğinden System.Globalization.CultureInfo.CurrentCulture erişilebilir.

CultureInfo.InvariantCulture aşağıdaki alan türleri için kullanılır (<input type="{TYPE}" />yer tutucu türüdür {TYPE} ):

  • date
  • number

Önceki alan türleri:

  • Uygun tarayıcı tabanlı biçimlendirme kuralları kullanılarak görüntülenir.
  • Serbest biçimli metin içeremez.
  • Tarayıcının uygulamasına göre kullanıcı etkileşimi özelliklerini sağlayın.

Blazor , geçerli kültürdeki değerleri işlemek için yerleşik destek sağlar. Bu nedenle ve alan türleri kullanılırken date number ile @bind:culture bir kültür belirtilmesi önerilmez.

Aşağıdaki alan türlerinin belirli biçimlendirme gereksinimleri vardır ve tüm ana tarayıcılar tarafından desteklenmez, bu nedenle tarafından Blazordesteklenmez:

  • datetime-local
  • month
  • week

Önceki türlerin geçerli tarayıcı desteği için bkz . Kullanabilir miyim?

Unicode (ICU) desteği için .NET genelleştirmesi ve Uluslararası Bileşenleri (Blazor WebAssembly)

Blazor WebAssembly , azaltılmış bir genelleştirme API'sini ve Unicode (ICU) yerel ayarları için yerleşik Uluslararası Bileşenler kümesini kullanır. Daha fazla bilgi için bkz . .NET genelleştirme ve ICU: WebAssembly üzerinde ICU.

Uygulamanın yerel ayarlarını denetlemek üzere özel bir ICU veri dosyası yüklemek için bkz . WASM Genelleştirme Icu. Şu anda özel ICU veri dosyasını el ile oluşturmak gerekir. Kasım 2025'te .NET 10 için dosya oluşturma işlemini kolaylaştıran .NET araçları planlanıyor.

Blazor WebAssembly , azaltılmış bir genelleştirme API'sini ve Unicode (ICU) yerel ayarları için yerleşik Uluslararası Bileşenler kümesini kullanır. Daha fazla bilgi için bkz . .NET genelleştirme ve ICU: WebAssembly üzerinde ICU.

Bir uygulamada yerel ayarların özel bir Blazor WebAssembly alt kümesinin yüklenmesi .NET 8 veya sonraki sürümlerde desteklenir. Daha fazla bilgi için bu makalenin 8.0 veya sonraki bir sürümü için bu bölüme erişin.

Sabit genelleştirme

Bu bölüm yalnızca istemci tarafı Blazor senaryoları için geçerlidir.

Uygulama yerelleştirme gerektirmiyorsa, uygulamayı genellikle Birleşik Devletler İngilizceyi (en-US) temel alan sabit kültürü destekleyecek şekilde yapılandırın. Sabit genelleştirmenin kullanılması, uygulamanın indirme boyutunu azaltır ve uygulamanın daha hızlı başlatılmasına neden olur. InvariantGlobalization özelliğini true uygulamanın proje dosyasında (.csproj):

<PropertyGroup>
  <InvariantGlobalization>true</InvariantGlobalization>
</PropertyGroup>

Alternatif olarak, sabit genelleştirmeyi aşağıdaki yaklaşımlarla yapılandırın:

  • runtimeconfig.json içinde:

    {
  "runtimeOptions": {
    "configProperties": {
      "System.Globalization.Invariant": true
    }
  }
}

  • Ortam değişkeniyle:

    • Anahtar: DOTNET_SYSTEM_GLOBALIZATION_INVARIANT
    • Değer: true veya 1

Daha fazla bilgi için bkz. Genelleştirme için çalışma zamanı yapılandırma seçenekleri (.NET belgeleri).

Saat dilimi bilgileri

Bu bölüm yalnızca istemci tarafı Blazor senaryoları için geçerlidir.

Sabit genelleştirmenin benimsenmesi yalnızca yerelleştirilmemiş saat dilimi adlarının kullanılmasına neden olur. Uygulamanın indirme boyutunu azaltan ve uygulamanın daha hızlı başlatılmasına neden olan saat dilimi kodunu ve verilerini kırpmak için, uygulamanın proje dosyasında değeri true olan MSBuild özelliğini uygulayın<InvariantTimezone>:

<PropertyGroup>
  <InvariantTimezone>true</InvariantTimezone>
</PropertyGroup>

Not

<BlazorEnableTimeZoneSupport> önceki <InvariantTimezone> bir ayarı geçersiz kılar. Ayarı kaldırmanızı <BlazorEnableTimeZoneSupport> öneririz.

Saat dilimi bilgilerini doğru yapmak için bir veri dosyası eklenir. Uygulama bu özelliği gerektirmiyorsa, uygulamanın proje dosyasında MSBuild özelliğini false olarak ayarlayarak <BlazorEnableTimeZoneSupport> devre dışı bırakmayı göz önünde bulundurun:

<PropertyGroup>
  <BlazorEnableTimeZoneSupport>false</BlazorEnableTimeZoneSupport>
</PropertyGroup>

Tanıtım bileşeni

Bu makalede ele alınan genelleştirme ve yerelleştirme kavramlarını göstermek Blazor için aşağıdaki CultureExample1 bileşen kullanılabilir.

CultureExample1.razor:

@page "/culture-example-1"
@using System.Globalization

<h1>Culture Example 1</h1>

<ul>
    <li><b>CurrentCulture</b>: @CultureInfo.CurrentCulture</li>
    <li><b>CurrentUICulture</b>: @CultureInfo.CurrentUICulture</li>
</ul>

<h2>Rendered values</h2>

<ul>
    <li><b>Date</b>: @dt</li>
    <li><b>Number</b>: @number.ToString("N2")</li>
</ul>

<h2><code>&lt;input&gt;</code> elements that don't set a <code>type</code></h2>

<p>
    The following <code>&lt;input&gt;</code> elements use
    <code>CultureInfo.CurrentCulture</code>.
</p>

<ul>
    <li><label><b>Date:</b> <input @bind="dt" /></label></li>
    <li><label><b>Number:</b> <input @bind="number" /></label></li>
</ul>

<h2><code>&lt;input&gt;</code> elements that set a <code>type</code></h2>

<p>
    The following <code>&lt;input&gt;</code> elements use
    <code>CultureInfo.InvariantCulture</code>.
</p>

<ul>
    <li><label><b>Date:</b> <input type="date" @bind="dt" /></label></li>
    <li><label><b>Number:</b> <input type="number" @bind="number" /></label></li>
</ul>

@code {
    private DateTime dt = DateTime.Now;
    private double number = 1999.69;
}

Önceki örnekteki () sayı dizesi biçimi (N2.ToString("N2")), standart bir .NET sayısal biçim tanımlayıcısıdır. Biçimi N2 tüm sayısal türler için desteklenir, bir grup ayırıcısı içerir ve en fazla iki ondalık basamak işler.

İsteğe bağlı olarak, bileşenin (NavMenu.razor) CultureExample1 bileşenindeki NavMenu gezintiye bir menü öğesi ekleyin.

Üst bilgiden Accept-Language kültürü dinamik olarak ayarlama

Microsoft.Extensions.Localization Paketi uygulamaya ekleyin.

Üst Accept-Language bilgi tarayıcı tarafından ayarlanır ve tarayıcı ayarlarında kullanıcının dil tercihleri tarafından denetlenmektedir. Tarayıcı ayarlarında, kullanıcı tercih sırasına göre bir veya daha fazla tercih edilen dil ayarlar. Tercih sırası, tarayıcı tarafından üst bilgideki her dil için kalite değerlerini (q0-1) ayarlamak için kullanılır. Aşağıdaki örnekte İngilizce, İngilizce ve Kosta Rika İspanyolcası Birleşik Devletler Birleşik Devletler İngilizce veya İngilizce tercihi verilmiştir:

Accept-Language: en-US,en; q=0.9,es-CR; q=0.8

Uygulamanın kültürü, uygulamanın desteklenen bir kültürüyle eşleşen ilk istenen dille eşleşerek ayarlanır.

İstemci tarafı geliştirmede, BlazorWebAssemblyLoadAllGlobalizationData istemci tarafı uygulamasının proje dosyasında ():true.csproj

<PropertyGroup>
  <BlazorWebAssemblyLoadAllGlobalizationData>true</BlazorWebAssemblyLoadAllGlobalizationData>
</PropertyGroup>

İstemci tarafı geliştirmede, üst bilgiden Accept-Language kültürü dinamik olarak ayarlamak desteklenmez.

Not

Uygulamanın belirtimi desteklenen kültürleri açık bir listeyle sınırlamayı gerektiriyorsa, bu makalenin Kullanıcı tercihine göre istemci tarafı kültürünü dinamik olarak ayarlama bölümüne bakın.

Uygulamalar Yerelleştirme Ara Yazılımı kullanılarak yerelleştirilir. ile AddLocalizationuygulamaya yerelleştirme hizmetleri ekleyin.

Hizmetlerin kaydedildiği dosyaya Program aşağıdaki satırı ekleyin:

builder.Services.AddLocalization();

Sunucu tarafı geliştirmede, istek kültürünü denetleyebilen herhangi bir ara yazılımdan önce uygulamanın desteklenen kültürlerini belirtin. Genel olarak, çağrısından MapRazorComponentshemen önce İstek Yerelleştirme Ara Yazılımı'nı yerleştirin. Aşağıdaki örnek, Birleşik Devletler İngilizce ve Kosta Rika İspanyolcası için desteklenen kültürleri yapılandırıyor:

Sunucu tarafı geliştirmede, yönlendirme ara yazılımı (UseRouting) işleme işlem hattına eklendikten hemen sonra uygulamanın desteklenen kültürlerini belirtin. Aşağıdaki örnek, Birleşik Devletler İngilizce ve Kosta Rika İspanyolcası için desteklenen kültürleri yapılandırıyor:

app.UseRequestLocalization(new RequestLocalizationOptions()
    .AddSupportedCultures(new[] { "en-US", "es-CR" })
    .AddSupportedUICultures(new[] { "en-US", "es-CR" }));

Dosyanın ara yazılım işlem hattında Program Yerelleştirme Ara Yazılımını sıralama hakkında bilgi için bkz . ASP.NET Core Ara Yazılımı.

Genelleştirmenin CultureExample1 nasıl çalıştığını incelemek için Tanıtım bileşeni bölümünde gösterilen bileşeni kullanın. Birleşik Devletler İngilizce (en-US) ile bir istekte bulun. Tarayıcının dil ayarlarında Kosta Rika İspanyolcasına (es-CR) geçin. Web sayfasını yeniden isteyin.

Not

Bazı tarayıcılar sizi hem istekler hem de tarayıcının kendi kullanıcı arabirimi ayarları için varsayılan dil ayarını kullanmaya zorlar. Bu, ayarlı kullanıcı arabirimi ekranlarının tümü okuyamadığınız bir dilde sonuçlanabileceği için dili yeniden anladığınız bir dille değiştirmeyi zorlaştırabilir. Web sayfası istekleri için varsayılan bir dil ayarlamanıza ve tarayıcının ayarları kullanıcı arabirimini kendi dilinizde bırakmanıza izin vermesinden dolayı, Opera gibi bir tarayıcı test için iyi bir seçimdir.

Kültür Birleşik Devletler İngilizce ()en-US olduğunda, işlenen bileşen ondalık değeri () için nokta içeren sayılarda ay/gün tarih biçimlendirmesi (6/7), 12 saatlik saat (PMAM/1,999.69 ) ve virgül ayırıcıları kullanır:

  • Tarih: 07.06.2021 06:45:22
  • Sayı: 1.999,69

Kültür Kosta Rika İspanyolcası (es-CR olduğunda), işlenen bileşen ondalık değeri () için virgül içeren sayılarda gün/ay tarih biçimlendirmesi (7/61.999,69), 24 saatlik zaman ve nokta ayırıcılarını kullanır:

  • Tarih: 6/7/2021 6:49:38
  • Sayı: 1.999,69

İstemci tarafı kültürünü statik olarak ayarlama

BlazorWebAssemblyLoadAllGlobalizationData özelliğini true uygulamanın proje dosyasında (.csproj):

<PropertyGroup>
  <BlazorWebAssemblyLoadAllGlobalizationData>true</BlazorWebAssemblyLoadAllGlobalizationData>
</PropertyGroup>

İstemci tarafı işleme için Ara Dil (IL) Bağlayıcı yapılandırması, açıkça istenen yerel ayarlar dışında uluslararasılaştırma bilgilerini çıkarır. Daha fazla bilgi için bkz . ASP.NET Core Blazoriçin Bağlayıcıyı Yapılandırma.

Başlangıç seçeneğiyle applicationCultureBlazor başladığında uygulamanın kültürü JavaScript'te Blazor ayarlanabilir. Aşağıdaki örnek, uygulamayı Birleşik Devletler İngilizce (en-US) kültürü kullanılarak başlatacak şekilde yapılandırılır.

etiketine ekleyerek otomatik başlatmayı BlazorönleyinBlazor:autostart="false" <script>

<script src="{BLAZOR SCRIPT}" autostart="false"></script>

Yukarıdaki örnekte, {BLAZOR SCRIPT} yer tutucu betik yolu ve dosya adıdır Blazor . Betiğin konumu için bkz . ASP.NET Core Blazor proje yapısı.

Etiketinden sonra <script>Blazorve kapanış </body> etiketinden önce aşağıdaki <script> bloğu ekleyin:

Blazor Web App:

<script>
  Blazor.start({
    webAssembly: {
      applicationCulture: 'en-US'
    }
  });
</script>

Tek başına Blazor WebAssembly:

<script>
  Blazor.start({
    applicationCulture: 'en-US'
  });
</script>

değeri applicationCulture BCP-47 dil etiketi biçimine uygun olmalıdır. Blazor'ı başlatma hakkında daha fazla bilgi için bkz. ASP.NET Core Blazor'ı başlatma.

Kültürün Blazorbaşlangıç seçeneğini ayarlamanın bir alternatifi, kültürü C# kodunda ayarlamaktır. CultureInfo.DefaultThreadCurrentUICulture Program ve dosyasını aynı kültüre ayarlayınCultureInfo.DefaultThreadCurrentCulture.

Ad alanını System.Globalization dosyaya Program ekleyin:

using System.Globalization;

( öğesini oluşturan ve çalıştıran WebAssemblyHostBuilderawait builder.Build().RunAsync();satırdan önce kültür ayarlarını ekleyin:

CultureInfo.DefaultThreadCurrentCulture = new CultureInfo("en-US");
CultureInfo.DefaultThreadCurrentUICulture = new CultureInfo("en-US");

Not

Blazor WebAssembly Şu anda uygulamalar yalnızca tabanlı DefaultThreadCurrentCulturekaynakları yükler. Daha fazla bilgi için bkz Blazor . WASM yalnızca geçerli kültüre dayanır (geçerli kullanıcı arabirimi kültürüne uyulmuyor) (dotnet/aspnetcore #56824).

Genelleştirmenin CultureExample1 nasıl çalıştığını incelemek için Tanıtım bileşeni bölümünde gösterilen bileşeni kullanın. Birleşik Devletler İngilizce (en-US) ile bir istekte bulun. Tarayıcının dil ayarlarında Kosta Rika İspanyolcasına (es-CR) geçin. Web sayfasını yeniden isteyin. İstenen dil Kosta Rika İspanyolcası olduğunda uygulamanın kültürü İngilizce (en-US) Birleşik Devletler kalır.

Sunucu tarafı kültürünü statik olarak ayarlama

Sunucu tarafı uygulamalar Yerelleştirme Ara Yazılımı kullanılarak yerelleştirilir. ile AddLocalizationuygulamaya yerelleştirme hizmetleri ekleyin.

Program dosyasında:

builder.Services.AddLocalization();

İstek kültürünü Program denetleyebilen herhangi bir ara yazılımdan önce dosyadaki statik kültürü belirtin. Genel olarak, İstek Yerelleştirme Ara Yazılımını hemen önüne MapRazorComponentsyerleştirin. Aşağıdaki örnekte İngilizce Birleşik Devletler yapılandırılır:

İşleme işlem hattına Program Yönlendirme Ara Yazılımı (UseRouting) eklendikten hemen sonra dosyadaki statik kültürü belirtin. Aşağıdaki örnekte İngilizce Birleşik Devletler yapılandırılır:

app.UseRequestLocalization("en-US");

için UseRequestLocalization kültür değeri BCP-47 dil etiketi biçimine uygun olmalıdır.

Dosyanın ara yazılım işlem hattında Program Yerelleştirme Ara Yazılımını sıralama hakkında bilgi için bkz . ASP.NET Core Ara Yazılımı.

Sunucu tarafı uygulamalar Yerelleştirme Ara Yazılımı kullanılarak yerelleştirilir. ile AddLocalizationuygulamaya yerelleştirme hizmetleri ekleyin.

In Startup.ConfigureServices (Startup.cs):

services.AddLocalization();

İşlem işlem hattına Yönlendirme Ara Yazılımı eklendikten hemen sonra içindeki Startup.ConfigureStartup.cs() statik kültürü belirtin. Aşağıdaki örnekte İngilizce Birleşik Devletler yapılandırılır:

app.UseRequestLocalization("en-US");

için UseRequestLocalization kültür değeri BCP-47 dil etiketi biçimine uygun olmalıdır.

Yerelleştirme Ara Yazılımının ara yazılım işlem hattında Startup.Configuresıralanması hakkında bilgi için bkz . ASP.NET Core Ara Yazılımı.

Genelleştirmenin CultureExample1 nasıl çalıştığını incelemek için Tanıtım bileşeni bölümünde gösterilen bileşeni kullanın. Birleşik Devletler İngilizce (en-US) ile bir istekte bulun. Tarayıcının dil ayarlarında Kosta Rika İspanyolcasına (es-CR) geçin. Web sayfasını yeniden isteyin. İstenen dil Kosta Rika İspanyolcası olduğunda uygulamanın kültürü İngilizce (en-US) Birleşik Devletler kalır.

İstemci tarafı kültürünü kullanıcı tercihlerine göre dinamik olarak ayarlama

Bir uygulamanın kullanıcının tercihini depolayabileceği konumlara örnek olarak tarayıcı yerel depolama (istemci tarafı senaryoları için yaygın), yerelleştirme cookie veya veritabanı (sunucu tarafı senaryoları için yaygın) veya dış veritabanına bağlı ve web API'sinin eriştiği dış hizmet verilebilir. Aşağıdaki örnekte tarayıcı yerel depolamanın nasıl kullanılacağı gösterilmektedir.

Microsoft.Extensions.Localization Paketi uygulamaya ekleyin.

Not

.NET uygulamalarına paket ekleme hakkında yönergeler için, Paket tüketimi iş akışında (NuGet belgeleri) paketleri yüklemek ve yönetmek altındaki makalelere bakın. NuGet.org'da doğru paket sürümlerini onaylayın.

BlazorWebAssemblyLoadAllGlobalizationData Özelliğini true proje dosyasında olarak ayarlayın:

<PropertyGroup>
  <BlazorWebAssemblyLoadAllGlobalizationData>true</BlazorWebAssemblyLoadAllGlobalizationData>
</PropertyGroup>

Uygulamanın istemci tarafı işleme kültürü, çerçevenin API'sini Blazor kullanarak ayarlanır. Kullanıcının kültür seçimi tarayıcı yerel depolama alanında kalıcı hale gelebilir.

Tarayıcı yerel depolama alanıyla kullanıcının kültür seçimini almak ve ayarlamak için 's etiketinden sonra Blazor<script> işlevler sağlayın:JS

<script>
  window.blazorCulture = {
    get: () => window.localStorage['BlazorCulture'],
    set: (value) => window.localStorage['BlazorCulture'] = value
  };
</script>

Not

Yukarıdaki örnek, istemciyi genel işlevlerle kirletir. Üretim uygulamalarında daha iyi bir yaklaşım için bkz . JavaScript modüllerinde JavaScript yalıtımı.

ve ad System.Globalization Microsoft.JSInterop alanlarını dosyanın en üstüne Program ekleyin:

using System.Globalization;
using Microsoft.JSInterop;

Aşağıdaki satırı kaldırın:

- await builder.Build().RunAsync();

Önceki satırı aşağıdaki kodla değiştirin. Kod ile 'nin yerelleştirme hizmetini uygulamanın hizmet koleksiyonuna ekler Blazorve kullanıcının yerel depolamadan kültür seçimini çağırmak JS ve almak için birlikte çalışma kullanırJS.AddLocalization Yerel depolama kullanıcı için bir kültür içermiyorsa, kod varsayılan Birleşik Devletler İngilizce (en-US ) değerini ayarlar.

builder.Services.AddLocalization();

var host = builder.Build();

const string defaultCulture = "en-US";

var js = host.Services.GetRequiredService<IJSRuntime>();
var result = await js.InvokeAsync<string>("blazorCulture.get");
var culture = CultureInfo.GetCultureInfo(result ?? defaultCulture);

if (result == null)
{
    await js.InvokeVoidAsync("blazorCulture.set", defaultCulture);
}

CultureInfo.DefaultThreadCurrentCulture = culture;
CultureInfo.DefaultThreadCurrentUICulture = culture;

await host.RunAsync();

Not

Blazor WebAssembly Şu anda uygulamalar yalnızca tabanlı DefaultThreadCurrentCulturekaynakları yükler. Daha fazla bilgi için bkz Blazor . WASM yalnızca geçerli kültüre dayanır (geçerli kullanıcı arabirimi kültürüne uyulmuyor) (dotnet/aspnetcore #56824).

Aşağıdaki CultureSelector bileşen aşağıdaki eylemlerin nasıl gerçekleştirileceklerini gösterir:

  • Birlikte çalışma aracılığıyla JS kullanıcının kültür seçimini tarayıcı yerel depolama alanına ayarlayın.
  • İstenen ()forceLoad: true bileşenini yeniden yükleyin. Bu bileşen güncelleştirilmiş kültürü kullanır.

CultureSelector.razor:

@using System.Globalization
@inject IJSRuntime JS
@inject NavigationManager Navigation

<p>
    <label>
        Select your locale:
        <select @bind="selectedCulture" @bind:after="ApplySelectedCultureAsync">
            @foreach (var culture in supportedCultures)
            {
                <option value="@culture">@culture.DisplayName</option>
            }
        </select>
    </label>
</p>

@code
{
    private CultureInfo[] supportedCultures = new[]
    {
        new CultureInfo("en-US"),
        new CultureInfo("es-CR"),
    };

    private CultureInfo? selectedCulture;

    protected override void OnInitialized()
    {
        selectedCulture = CultureInfo.CurrentCulture;
    }

    private async Task ApplySelectedCultureAsync()
    {
        if (CultureInfo.CurrentCulture != selectedCulture)
        {
            await JS.InvokeVoidAsync("blazorCulture.set", selectedCulture!.Name);

            Navigation.NavigateTo(Navigation.Uri, forceLoad: true);
        }
    }
}

@using System.Globalization
@inject IJSRuntime JS
@inject NavigationManager Navigation

<p>
    <label>
        Select your locale:
        <select value="@selectedCulture" @onchange="HandleSelectedCultureChanged">
            @foreach (var culture in supportedCultures)
            {
                <option value="@culture">@culture.DisplayName</option>
            }
        </select>
    </label>
</p>

@code
{
    private CultureInfo[] supportedCultures = new[]
    {
        new CultureInfo("en-US"),
        new CultureInfo("es-CR"),
    };

    private CultureInfo? selectedCulture;

    protected override void OnInitialized()
    {
        selectedCulture = CultureInfo.CurrentCulture;
    }

    private async Task HandleSelectedCultureChanged(ChangeEventArgs args)
    {
        selectedCulture = CultureInfo.GetCultureInfo((string)args.Value!);

        if (CultureInfo.CurrentCulture != selectedCulture)
        {
            await JS.InvokeVoidAsync("blazorCulture.set", selectedCulture!.Name);

            Navigation.NavigateTo(Navigation.Uri, forceLoad: true);
        }
    }
}

Not

hakkında IJSInProcessRuntimedaha fazla bilgi için bkz . ASP.NET Core'da Blazor.NET yöntemlerinden JavaScript işlevlerini çağırma.

bileşenindeki öğesinin </main> kapanış etiketinin MainLayout içine ()MainLayout.razor bileşenini ekleyin CultureSelector :

<article class="bottom-row px-4">
    <CultureSelector />
</article>

CultureExample1 Önceki örneğin nasıl çalıştığını incelemek için Tanıtım bileşeni bölümünde gösterilen bileşeni kullanın.

Sunucu tarafı kültürünü kullanıcı tercihlerine göre dinamik olarak ayarlama

Bir uygulamanın kullanıcının tercihini depolayabileceği konumlara örnek olarak tarayıcı yerel depolama (istemci tarafı senaryoları için yaygın), yerelleştirme cookie veya veritabanı (sunucu tarafı senaryoları için yaygın) veya dış veritabanına bağlı ve web API'sinin eriştiği dış hizmet verilebilir. Aşağıdaki örnekte yerelleştirmenin nasıl kullanılacağı gösterilmektedir cookie.

Not

Aşağıdaki örnekte, uygulamanın bileşendeki () bileşende Routes App etkileşimli sunucu tarafı işlemeyi (etkileşimli SSR) belirterek genel etkileşimi benimsediği varsayılır:Components/App.razor

<Routes @rendermode="InteractiveServer" />

Uygulama sayfa başına/bileşen etkileşimini benimsediyse, örnek bileşenlerinin işleme modlarını değiştirmek için bu bölümün sonundaki açıklamalara bakın.

Microsoft.Extensions.Localization Paketi uygulamaya ekleyin.

Not

.NET uygulamalarına paket ekleme hakkında yönergeler için, Paket tüketimi iş akışında (NuGet belgeleri) paketleri yüklemek ve yönetmek altındaki makalelere bakın. NuGet.org'da doğru paket sürümlerini onaylayın.

Sunucu tarafı uygulamalar Yerelleştirme Ara Yazılımı kullanılarak yerelleştirilir. ile AddLocalizationuygulamaya yerelleştirme hizmetleri ekleyin.

Program dosyasında:

builder.Services.AddLocalization();

ile RequestLocalizationOptionsuygulamanın varsayılan ve desteklenen kültürlerini ayarlayın.

İstek işleme işlem hattında çağrısından MapRazorComponents önce aşağıdaki kodu yerleştirin:

Yönlendirme Ara Yazılımı (UseRouting) istek işleme işlem hattına eklendikten sonra aşağıdaki kodu yerleştirin:

var supportedCultures = new[] { "en-US", "es-CR" };
var localizationOptions = new RequestLocalizationOptions()
    .SetDefaultCulture(supportedCultures[0])
    .AddSupportedCultures(supportedCultures)
    .AddSupportedUICultures(supportedCultures);

app.UseRequestLocalization(localizationOptions);

Ara yazılım işlem hattında Yerelleştirme Ara Yazılımını sıralama hakkında bilgi için bkz . ASP.NET Core Ara Yazılımı.

Aşağıdaki örnekte, Yerelleştirme Ara Yazılımı tarafından okunabilen bir cookie içinde geçerli kültürün nasıl ayarlanacağı gösterilmektedir.

Bileşen için App aşağıdaki ad alanları gereklidir:

Bileşen dosyasının (Components/App.razor) en üstüne App aşağıdakileri ekleyin:

@using System.Globalization
@using Microsoft.AspNetCore.Localization

Bileşen dosyasının altına App aşağıdaki @code bloğu ekleyin:

@code {
    [CascadingParameter]
    public HttpContext? HttpContext { get; set; }

    protected override void OnInitialized()
    {
        HttpContext?.Response.Cookies.Append(
            CookieRequestCultureProvider.DefaultCookieName,
            CookieRequestCultureProvider.MakeCookieValue(
                new RequestCulture(
                    CultureInfo.CurrentCulture,
                    CultureInfo.CurrentUICulture)));
    }
}

Dosyada Pages/_Host.cshtml yapılan değişiklikler aşağıdaki ad alanlarını gerektirir:

Aşağıdakileri dosyaya ekleyin:

@using System.Globalization
@using Microsoft.AspNetCore.Localization
@{
    this.HttpContext.Response.Cookies.Append(
        CookieRequestCultureProvider.DefaultCookieName,
        CookieRequestCultureProvider.MakeCookieValue(
            new RequestCulture(
                CultureInfo.CurrentCulture,
                CultureInfo.CurrentUICulture)));
}

Ara yazılım işlem hattında Yerelleştirme Ara Yazılımını sıralama hakkında bilgi için bkz . ASP.NET Core Ara Yazılımı.

Uygulama denetleyici eylemlerini işlemek üzere yapılandırılmamışsa:

  • Dosyadaki hizmet koleksiyonunda Program arayarak AddControllers MVC hizmetleri ekleyin:

    builder.Services.AddControllers();

  • üzerinde arayarak MapControllers dosyaya Program denetleyici uç noktası yönlendirmesi IEndpointRouteBuilder ekleyin:app

    app.MapControllers();

Kullanıcının bir kültür seçmesine izin veren kullanıcı arabirimi sağlamak için, yerelleştirme cookieile yeniden yönlendirme tabanlı bir yaklaşım kullanın. Uygulama, kullanıcının seçili kültürünü bir denetleyiciye yönlendirme yoluyla kalıcı hale getirir. Denetleyici, kullanıcının seçili kültürünü bir cookie olarak ayarlar ve kullanıcıyı özgün URI'ye geri yönlendirir. Bu işlem, bir kullanıcı güvenli bir kaynağa erişmeye çalıştığında, kullanıcının bir oturum açma sayfasına yeniden yönlendirildiği ve ardından özgün kaynağa geri yönlendirildiği bir web uygulamasında gerçekleşen işlemlere benzer.

Controllers/CultureController.cs:

using Microsoft.AspNetCore.Localization;
using Microsoft.AspNetCore.Mvc;

[Route("[controller]/[action]")]
public class CultureController : Controller
{
    public IActionResult Set(string culture, string redirectUri)
    {
        if (culture != null)
        {
            HttpContext.Response.Cookies.Append(
                CookieRequestCultureProvider.DefaultCookieName,
                CookieRequestCultureProvider.MakeCookieValue(
                    new RequestCulture(culture, culture)));
        }

        return LocalRedirect(redirectUri);
    }
}

Uyarı

LocalRedirect Yukarıdaki örnekte gösterildiği gibi, açık yeniden yönlendirme saldırılarını önlemek için eylem sonucunu kullanın. Daha fazla bilgi için bkz . ASP.NET Core'da açık yeniden yönlendirme saldırılarını önleme.

Aşağıdaki CultureSelector bileşen, yönteminin Set CultureController yeni kültürle nasıl çağrılacaklarını gösterir. Bileşen, uygulama genelinde kullanılmak üzere klasörüne yerleştirilir Shared .

CultureSelector.razor:

@using System.Globalization
@inject IJSRuntime JS
@inject NavigationManager Navigation

<p>
    <label>
        Select your locale:
        <select @bind="selectedCulture" @bind:after="ApplySelectedCultureAsync">
            @foreach (var culture in supportedCultures)
            {
                <option value="@culture">@culture.DisplayName</option>
            }
        </select>
    </label>
</p>

@code
{
    private CultureInfo[] supportedCultures = new[]
    {
        new CultureInfo("en-US"),
        new CultureInfo("es-CR"),
    };

    private CultureInfo? selectedCulture;

    protected override void OnInitialized()
    {
        selectedCulture = CultureInfo.CurrentCulture;
    }

    private async Task ApplySelectedCultureAsync()
    {
        if (CultureInfo.CurrentCulture != selectedCulture)
        {
            var uri = new Uri(Navigation.Uri)
                .GetComponents(UriComponents.PathAndQuery, UriFormat.Unescaped);
            var cultureEscaped = Uri.EscapeDataString(selectedCulture.Name);
            var uriEscaped = Uri.EscapeDataString(uri);

            Navigation.NavigateTo(
                $"Culture/Set?culture={cultureEscaped}&redirectUri={uriEscaped}",
                forceLoad: true);
        }
    }
}

@using System.Globalization
@inject IJSRuntime JS
@inject NavigationManager Navigation

<p>
    <label>
        Select your locale:
        <select value="@selectedCulture" @onchange="HandleSelectedCultureChanged">
            @foreach (var culture in supportedCultures)
            {
                <option value="@culture">@culture.DisplayName</option>
            }
        </select>
    </label>
</p>

@code
{
    private CultureInfo[] supportedCultures = new[]
    {
        new CultureInfo("en-US"),
        new CultureInfo("es-CR"),
    };

    private CultureInfo? selectedCulture;

    protected override void OnInitialized()
    {
        selectedCulture = CultureInfo.CurrentCulture;
    }

    private async Task HandleSelectedCultureChanged(ChangeEventArgs args)
    {
        selectedCulture = CultureInfo.GetCultureInfo((string)args.Value!);

        if (CultureInfo.CurrentCulture != selectedCulture)
        {
            var uri = new Uri(Navigation.Uri)
                .GetComponents(UriComponents.PathAndQuery, UriFormat.Unescaped);
            var cultureEscaped = Uri.EscapeDataString(selectedCulture.Name);
            var uriEscaped = Uri.EscapeDataString(uri);

            Navigation.NavigateTo(
                $"Culture/Set?culture={cultureEscaped}&redirectUri={uriEscaped}",
                forceLoad: true);
        }
    }
}

CultureSelector Bileşeni bileşene MainLayout ekleyin. Dosyadaki kapanış </main> etiketinin içine aşağıdaki işaretlemeyi Components/Layout/MainLayout.razor yerleştirin:

CultureSelector Bileşeni bileşene MainLayout ekleyin. Dosyadaki kapanış </main> etiketinin içine aşağıdaki işaretlemeyi Shared/MainLayout.razor yerleştirin:

<article class="bottom-row px-4">
    <CultureSelector />
</article>

CultureExample1 Önceki örneğin nasıl çalıştığını incelemek için Tanıtım bileşeni bölümünde gösterilen bileşeni kullanın.

Yukarıdaki örnekte, uygulamanın bileşendeki () bileşeninde App Etkileşimli Sunucu işleme modunu Routes belirterek genel etkileşim benimsediği varsayılır:Components/App.razor

<Routes @rendermode="InteractiveServer" />

Uygulama sayfa başına/bileşen etkileşimini benimsiyorsa aşağıdaki değişiklikleri yapın:

  • Etkileşimli Sunucu işleme modunu bileşen dosyasının CultureExample1 (Components/Pages/CultureExample1.razor):

    @rendermode InteractiveServer

  • Uygulamanın ana düzeninde ()Components/Layout/MainLayout.razor Etkileşimli Sunucu işleme modunu bileşene CultureSelector uygulayın:

    <CultureSelector @rendermode="InteractiveServer" />

Kullanıcı tercihlerine göre kültürü Blazor Web App dinamik olarak ayarlama

Bu bölüm, Otomatik (Sunucu ve WebAssembly) etkileşimini benimseyenler için Blazor Web Appgeçerlidir.

Bir uygulamanın kullanıcının tercihini depolayabileceği konumlara örnek olarak tarayıcı yerel depolaması (istemci tarafı senaryoları için yaygın), yerelleştirme cookie veya veritabanında (sunucu tarafı senaryolar için yaygın), hem yerel depolama hem de yerelleştirme cookie (Blazor Web Appsunucu ve WebAssembly bileşenleriyle birlikte) veya dış veritabanına ekli ve web API'siyle erişilen bir dış hizmet verilebilir. Aşağıdaki örnekte, istemci tarafı işlenmiş (CSR) bileşenleri için tarayıcı yerel depolamasının nasıl kullanılacağı ve sunucu tarafı işlenen (SSR) bileşenleri için yerelleştirmenin cookie nasıl kullanılacağı gösterilmektedir.

Proje güncelleştirmeleri .Client

Microsoft.Extensions.Localization Paketi .Client projeye ekleyin.

Not

.NET uygulamalarına paket ekleme hakkında yönergeler için, Paket tüketimi iş akışında (NuGet belgeleri) paketleri yüklemek ve yönetmek altındaki makalelere bakın. NuGet.org'da doğru paket sürümlerini onaylayın.

BlazorWebAssemblyLoadAllGlobalizationData Özelliğini true proje dosyasında olarak .Client ayarlayın:

<PropertyGroup>
  <BlazorWebAssemblyLoadAllGlobalizationData>true</BlazorWebAssemblyLoadAllGlobalizationData>
</PropertyGroup>

proje Program dosyasının en üstüne .Client ve Microsoft.JSInterop ad System.Globalization alanlarını ekleyin:

using System.Globalization;
using Microsoft.JSInterop;

Aşağıdaki satırı kaldırın:

- await builder.Build().RunAsync();

Önceki satırı aşağıdaki kodla değiştirin. Kod ile 'nin yerelleştirme hizmetini uygulamanın hizmet koleksiyonuna ekler Blazorve kullanıcının yerel depolamadan kültür seçimini çağırmak JS ve almak için birlikte çalışma kullanırJS.AddLocalization Yerel depolama kullanıcı için bir kültür içermiyorsa, kod varsayılan Birleşik Devletler İngilizce (en-US ) değerini ayarlar.

builder.Services.AddLocalization();

var host = builder.Build();

const string defaultCulture = "en-US";

var js = host.Services.GetRequiredService<IJSRuntime>();
var result = await js.InvokeAsync<string>("blazorCulture.get");
var culture = CultureInfo.GetCultureInfo(result ?? defaultCulture);

if (result == null)
{
    await js.InvokeVoidAsync("blazorCulture.set", defaultCulture);
}

CultureInfo.DefaultThreadCurrentCulture = culture;
CultureInfo.DefaultThreadCurrentUICulture = culture;

await host.RunAsync();

Not

Blazor WebAssembly Şu anda uygulamalar yalnızca tabanlı DefaultThreadCurrentCulturekaynakları yükler. Daha fazla bilgi için bkz Blazor . WASM yalnızca geçerli kültüre dayanır (geçerli kullanıcı arabirimi kültürüne uyulmuyor) (dotnet/aspnetcore #56824).

Aşağıdaki CultureSelector bileşeni .Client projeye ekleyin.

Bileşen, SSR veya CSR bileşenleri için çalışmak üzere aşağıdaki yaklaşımları benimser:

  • İstemci tarafı genelleştirme verileri sunucu tarafı genelleştirme verilerinin sağladığı yerelleştirilmiş kültür görüntüleme adlarını içerdiğinden, açılan listedeki kullanılabilir her kültürün görünen adı bir sözlük tarafından sağlanır. Örneğin, sunucu tarafı yerelleştirme, kültür ne zaman en-US ve Ingles () farklı bir kültür kullanıldığında görüntülenirEnglish (United States). Kültür görünen adlarının yerelleştirilmesi genelleştirme ile Blazor WebAssembly kullanılamadığından, yüklenen herhangi bir kültür için istemcide İngilizce Birleşik Devletler görünen adı yalnızca en-USolur. Özel sözlük kullanmak, bileşenin en azından tam İngilizce kültür adlarını görüntülemesine izin verir.
  • Kullanıcı kültürü değiştirdiğinde, JS birlikte çalışma yerel tarayıcı depolamasında kültürü ayarlar ve bir denetleyici eylemi yerelleştirmeyi cookie kültürle güncelleştirir. Denetleyici daha sonra Sunucu projesi güncelleştirmeleri bölümünde uygulamaya eklenir.

Pages/CultureSelector.razor:

@using System.Globalization
@inject IJSRuntime JS
@inject NavigationManager Navigation

<p>
    <label>
        Select your locale:
        <select @bind="@selectedCulture" @bind:after="ApplySelectedCultureAsync">
            @foreach (var culture in supportedCultures)
            {
                <option value="@culture">@cultureDict[culture.Name]</option>
            }
        </select>
    </label>
</p>

@code
{
    private Dictionary<string, string> cultureDict = 
        new()
        {
            { "en-US", "English (United States)" },
            { "es-CR", "Spanish (Costa Rica)" }
        };

    private CultureInfo[] supportedCultures = new[]
    {
        new CultureInfo("en-US"),
        new CultureInfo("es-CR"),
    };

    private CultureInfo? selectedCulture;

    protected override void OnInitialized()
    {
        selectedCulture = CultureInfo.CurrentCulture;
    }

    private async Task ApplySelectedCultureAsync()
    {
        if (CultureInfo.CurrentCulture != selectedCulture)
        {
            await JS.InvokeVoidAsync("blazorCulture.set", selectedCulture!.Name);

            var uri = new Uri(Navigation.Uri)
                .GetComponents(UriComponents.PathAndQuery, UriFormat.Unescaped);
            var cultureEscaped = Uri.EscapeDataString(selectedCulture.Name);
            var uriEscaped = Uri.EscapeDataString(uri);

            Navigation.NavigateTo(
                $"Culture/Set?culture={cultureEscaped}&redirectUri={uriEscaped}",
                forceLoad: true);
        }
    }
}

Not

hakkında IJSInProcessRuntimedaha fazla bilgi için bkz . ASP.NET Core'da Blazor.NET yöntemlerinden JavaScript işlevlerini çağırma.

Projede .Client , CSR bileşenlerinde küreselleşmenin nasıl çalıştığını incelemek için aşağıdaki CultureClient bileşeni yerleştirin.

Pages/CultureClient.razor:

@page "/culture-client"
@rendermode InteractiveWebAssembly
@using System.Globalization

<PageTitle>Culture Client</PageTitle>

<h1>Culture Client</h1>

<ul>
    <li><b>CurrentCulture</b>: @CultureInfo.CurrentCulture</li>
    <li><b>CurrentUICulture</b>: @CultureInfo.CurrentUICulture</li>
</ul>

<h2>Rendered values</h2>

<ul>
    <li><b>Date</b>: @dt</li>
    <li><b>Number</b>: @number.ToString("N2")</li>
</ul>

<h2><code>&lt;input&gt;</code> elements that don't set a <code>type</code></h2>

<p>
    The following <code>&lt;input&gt;</code> elements use
    <code>CultureInfo.CurrentCulture</code>.
</p>

<ul>
    <li><label><b>Date:</b> <input @bind="dt" /></label></li>
    <li><label><b>Number:</b> <input @bind="number" /></label></li>
</ul>

<h2><code>&lt;input&gt;</code> elements that set a <code>type</code></h2>

<p>
    The following <code>&lt;input&gt;</code> elements use
    <code>CultureInfo.InvariantCulture</code>.
</p>

<ul>
    <li><label><b>Date:</b> <input type="date" @bind="dt" /></label></li>
    <li><label><b>Number:</b> <input type="number" @bind="number" /></label></li>
</ul>

@code {
    private DateTime dt = DateTime.Now;
    private double number = 1999.69;
}

Sunucu projesi güncelleştirmeleri

Microsoft.Extensions.Localization Paketi sunucu projesine ekleyin.

Not

.NET uygulamalarına paket ekleme hakkında yönergeler için, Paket tüketimi iş akışında (NuGet belgeleri) paketleri yüklemek ve yönetmek altındaki makalelere bakın. NuGet.org'da doğru paket sürümlerini onaylayın.

Sunucu tarafı uygulamalar Yerelleştirme Ara Yazılımı kullanılarak yerelleştirilir. ile AddLocalizationuygulamaya yerelleştirme hizmetleri ekleyin.

Hizmetlerin kaydedildiği sunucu projesinin Program dosyasında:

builder.Services.AddLocalization();

ile RequestLocalizationOptionsuygulamanın varsayılan ve desteklenen kültürlerini ayarlayın.

İstek işleme işlem hattında çağrısından MapRazorComponents önce aşağıdaki kodu yerleştirin:

var supportedCultures = new[] { "en-US", "es-CR" };
var localizationOptions = new RequestLocalizationOptions()
    .SetDefaultCulture(supportedCultures[0])
    .AddSupportedCultures(supportedCultures)
    .AddSupportedUICultures(supportedCultures);

app.UseRequestLocalization(localizationOptions);

Aşağıdaki örnekte, Yerelleştirme Ara Yazılımı tarafından okunabilen bir cookie içinde geçerli kültürün nasıl ayarlanacağı gösterilmektedir.

Bileşen için App aşağıdaki ad alanları gereklidir:

Bileşen dosyasının (Components/App.razor) en üstüne App aşağıdakileri ekleyin:

@using System.Globalization
@using Microsoft.AspNetCore.Localization

Uygulamanın istemci tarafı işleme kültürü, çerçevenin API'sini Blazor kullanarak ayarlanır. Bir kullanıcının kültür seçimi CSR bileşenleri için tarayıcı yerel depolama alanında kalıcı hale gelebilir.

etiketinden Blazor<script> sonra, tarayıcı yerel depolama alanıyla kullanıcının kültür seçimini almak ve ayarlamak için işlevler sağlayın:JS

<script>
  window.blazorCulture = {
    get: () => window.localStorage['BlazorCulture'],
    set: (value) => window.localStorage['BlazorCulture'] = value
  };
</script>

Not

Yukarıdaki örnek, istemciyi genel işlevlerle kirletir. Üretim uygulamalarında daha iyi bir yaklaşım için bkz . JavaScript modüllerinde JavaScript yalıtımı.

Bileşen dosyasının altına App aşağıdaki @code bloğu ekleyin:

@code {
    [CascadingParameter]
    public HttpContext? HttpContext { get; set; }

    protected override void OnInitialized()
    {
        HttpContext?.Response.Cookies.Append(
            CookieRequestCultureProvider.DefaultCookieName,
            CookieRequestCultureProvider.MakeCookieValue(
                new RequestCulture(
                    CultureInfo.CurrentCulture,
                    CultureInfo.CurrentUICulture)));
    }
}

Sunucu projesi denetleyici eylemlerini işlemek üzere yapılandırılmamışsa:

  • Dosyadaki hizmet koleksiyonunda Program arayarak AddControllers MVC hizmetleri ekleyin:

    builder.Services.AddControllers();

  • üzerinde arayarak MapControllers dosyaya Program denetleyici uç noktası yönlendirmesi IEndpointRouteBuilder ekleyin:app

    app.MapControllers();

Kullanıcının SSR bileşenleri için bir kültür seçmesine izin vermek için, yerelleştirme cookieile yeniden yönlendirme tabanlı bir yaklaşım kullanın. Uygulama, kullanıcının seçili kültürünü bir denetleyiciye yönlendirme yoluyla kalıcı hale getirir. Denetleyici, kullanıcının seçili kültürünü bir cookie olarak ayarlar ve kullanıcıyı özgün URI'ye geri yönlendirir. Bu işlem, bir kullanıcı güvenli bir kaynağa erişmeye çalıştığında, kullanıcının bir oturum açma sayfasına yeniden yönlendirildiği ve ardından özgün kaynağa geri yönlendirildiği bir web uygulamasında gerçekleşen işlemlere benzer.

Controllers/CultureController.cs:

using Microsoft.AspNetCore.Localization;
using Microsoft.AspNetCore.Mvc;

[Route("[controller]/[action]")]
public class CultureController : Controller
{
    public IActionResult Set(string culture, string redirectUri)
    {
        if (culture != null)
        {
            HttpContext.Response.Cookies.Append(
                CookieRequestCultureProvider.DefaultCookieName,
                CookieRequestCultureProvider.MakeCookieValue(
                    new RequestCulture(culture, culture)));
        }

        return LocalRedirect(redirectUri);
    }
}

Uyarı

LocalRedirect Yukarıdaki örnekte gösterildiği gibi, açık yeniden yönlendirme saldırılarını önlemek için eylem sonucunu kullanın. Daha fazla bilgi için bkz . ASP.NET Core'da açık yeniden yönlendirme saldırılarını önleme.

CultureSelector Bileşeni bileşene MainLayout ekleyin. Dosyadaki kapanış </main> etiketinin içine aşağıdaki işaretlemeyi Components/Layout/MainLayout.razor yerleştirin:

<article class="bottom-row px-4">
    <CultureSelector @rendermode="InteractiveAuto" />
</article>

CultureExample1 Önceki örneğin nasıl çalıştığını incelemek için Tanıtım bileşeni bölümünde gösterilen bileşeni kullanın.

Sunucu projesinde, SSR bileşenleri için genelleştirmenin nasıl çalıştığını incelemek için aşağıdaki CultureServer bileşeni yerleştirin.

Components/Pages/CultureServer.razor:

@page "/culture-server"
@rendermode InteractiveServer
@using System.Globalization

<PageTitle>Culture Server</PageTitle>

<h1>Culture Server</h1>

<ul>
    <li><b>CurrentCulture</b>: @CultureInfo.CurrentCulture</li>
    <li><b>CurrentUICulture</b>: @CultureInfo.CurrentUICulture</li>
</ul>

<h2>Rendered values</h2>

<ul>
    <li><b>Date</b>: @dt</li>
    <li><b>Number</b>: @number.ToString("N2")</li>
</ul>

<h2><code>&lt;input&gt;</code> elements that don't set a <code>type</code></h2>

<p>
    The following <code>&lt;input&gt;</code> elements use
    <code>CultureInfo.CurrentCulture</code>.
</p>

<ul>
    <li><label><b>Date:</b> <input @bind="dt" /></label></li>
    <li><label><b>Number:</b> <input @bind="number" /></label></li>
</ul>

<h2><code>&lt;input&gt;</code> elements that set a <code>type</code></h2>

<p>
    The following <code>&lt;input&gt;</code> elements use
    <code>CultureInfo.InvariantCulture</code>.
</p>

<ul>
    <li><label><b>Date:</b> <input type="date" @bind="dt" /></label></li>
    <li><label><b>Number:</b> <input type="number" @bind="number" /></label></li>
</ul>

@code {
    private DateTime dt = DateTime.Now;
    private double number = 1999.69;
}

hem hem de CultureClient CultureServer bileşenlerini içindeki kenar çubuğu gezintisine Components/Layout/NavMenu.razorekleyin:

<div class="nav-item px-3">
    <NavLink class="nav-link" href="culture-server">
        <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Culture (Server)
    </NavLink>
</div>
<div class="nav-item px-3">
    <NavLink class="nav-link" href="culture-client">
        <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Culture (Client)
    </NavLink>
</div>

Etkileşimli Otomatik bileşenler

Bu bölümdeki yönergeler, Etkileşimli Otomatik işleme modunu benimseyen bileşenler için de çalışır:

@rendermode InteractiveAuto

Localization (Yerelleştirme)

Uygulama dinamik kültür seçimini henüz desteklemiyorsa paketi uygulamaya ekleyin Microsoft.Extensions.Localization .

Not

.NET uygulamalarına paket ekleme hakkında yönergeler için, Paket tüketimi iş akışında (NuGet belgeleri) paketleri yüklemek ve yönetmek altındaki makalelere bakın. NuGet.org'da doğru paket sürümlerini onaylayın.

İstemci tarafı yerelleştirme

BlazorWebAssemblyLoadAllGlobalizationData özelliğini true uygulamanın proje dosyasında (.csproj):

<PropertyGroup>
  <BlazorWebAssemblyLoadAllGlobalizationData>true</BlazorWebAssemblyLoadAllGlobalizationData>
</PropertyGroup>

Program dosyasında, ad alanının ad alanını System.Globalization dosyanın en üstüne ekleyin:

using System.Globalization;

ile AddLocalizationuygulamanın hizmet koleksiyonuna 'nin yerelleştirme hizmetini ekleyinBlazor:

builder.Services.AddLocalization();

Sunucu tarafı yerelleştirme

Uygulamanın kültürünü ayarlamak için Yerelleştirme Ara Yazılımı'nı kullanın.

Uygulama henüz dinamik kültür seçimini desteklemiyorsa:

  • ile AddLocalizationuygulamaya yerelleştirme hizmetleri ekleyin.
  • Dosyada uygulamanın varsayılan ve desteklenen kültürlerini Program belirtin. Aşağıdaki örnekte İngilizce ve Kosta Rika İspanyolcası Birleşik Devletler için desteklenen kültürler yapılandırılır.
builder.Services.AddLocalization();

İstek kültürünü denetleyebilen herhangi bir ara yazılımdan önce İstek Yerelleştirme Ara Yazılımını yerleştirin. Genellikle ara yazılımı çağrısından MapRazorComponentshemen önce yerleştirin:

İşleme işlem hattına Yönlendirme Ara Yazılımı (UseRouting) eklendikten hemen sonra:

var supportedCultures = new[] { "en-US", "es-CR" };
var localizationOptions = new RequestLocalizationOptions()
    .SetDefaultCulture(supportedCultures[0])
    .AddSupportedCultures(supportedCultures)
    .AddSupportedUICultures(supportedCultures);

app.UseRequestLocalization(localizationOptions);

Ara yazılım işlem hattında Yerelleştirme Ara Yazılımını sıralama hakkında bilgi için bkz . ASP.NET Core Ara Yazılımı.

  • ile AddLocalizationuygulamaya yerelleştirme hizmetleri ekleyin.
  • uygulamasındaStartup.cs uygulamanın varsayılan ve desteklenen kültürlerini Startup.Configure belirtin. Aşağıdaki örnekte İngilizce ve Kosta Rika İspanyolcası Birleşik Devletler için desteklenen kültürler yapılandırılır.

In Startup.ConfigureServices (Startup.cs):

services.AddLocalization();

Startup.Configure İşleme işlem hattına Yönlendirme Ara Yazılımı (UseRouting) eklendikten hemen sonra:

var supportedCultures = new[] { "en-US", "es-CR" };
var localizationOptions = new RequestLocalizationOptions()
    .SetDefaultCulture(supportedCultures[0])
    .AddSupportedCultures(supportedCultures)
    .AddSupportedUICultures(supportedCultures);

app.UseRequestLocalization(localizationOptions);

Yerelleştirme Ara Yazılımının ara yazılım işlem hattında Startup.Configuresıralanması hakkında bilgi için bkz . ASP.NET Core Ara Yazılımı.

Uygulamanın bir kullanıcının kültür ayarını depolamaya göre kaynakları yerelleştirmesi gerekiyorsa, yerelleştirme kültürü cookiekullanın. kullanımı cookie , WebSocket bağlantısının kültürü doğru bir şekilde yaymasını sağlar. Yerelleştirme düzenleri URL yolunu veya sorgu dizesini temel alırsa, düzen WebSockets ile çalışamayabilir ve bu nedenle kültürü kalıcı hale getirmez. Bu nedenle, önerilen yaklaşım bir yerelleştirme kültürü cookiekullanmaktır. Kullanıcının kültür seçimini kalıcı hale getiren bir örnek Razor ifade görmek için bu makalenin Kullanıcı tercihine göre sunucu tarafı kültürünü dinamik olarak ayarlama bölümüne bakın.

Yerelleştirilmiş kaynaklar örneği

Bu bölümdeki yerelleştirilmiş kaynaklar örneği, uygulamanın desteklenen kültürlerinin varsayılan yerel ayar olarak İngilizce (en) ve kullanıcı tarafından seçilebilen veya tarayıcıda belirtilen alternatif yerel ayar olarak İspanyolca (es) olduğu bu makaledeki önceki örneklerle birlikte çalışır.

Her yerel ayar için bir kaynak dosyası oluşturun. Aşağıdaki örnekte, İngilizce ve İspanyolca bir Greeting dize için kaynaklar oluşturulur:

  • İngilizce (en): Hello, World!
  • İspanyolca (es): ¡Hola, Mundo!

Not

Aşağıdaki kaynak dosyası, klasöre sağ tıklayıp Pages Yeni Öğe>Kaynakları Dosyası Ekle>seçilerek Visual Studio'ya eklenebilir. Dosyayı CultureExample2.resx olarak adlandırın. Düzenleyici göründüğünde, yeni bir giriş için veri sağlayın. Name Greeting değerini ve Değerini olarak Hello, World!ayarlayın. Dosyayı kaydedin.

Visual Studio Code kullanıyorsanız Tim Heuer'in ResX Görüntüleyicisi ve Düzenleyicisi'ni yüklemenizi öneririz. Klasöre Pages boş CultureExample2.resx bir dosya ekleyin. Uzantı, kullanıcı arabiriminde dosyanın yönetimini otomatik olarak devralır. Yeni Kaynak Ekle düğmesini seçin. (anahtar), Hello, World! (değer) ve None (açıklama) için giriş eklemek için Greeting yönergeleri izleyin. Dosyayı kaydedin. Dosyayı kapatıp yeniden açarsanız, kaynağı görebilirsiniz Greeting .

Tim Heuer'in ResX Görüntüleyicisi ve Düzenleyicisi Microsoft'a ait değildir veya microsoft tarafından korunmaz ve herhangi bir Microsoft Desteği Sözleşmesi veya lisansı kapsamında değildir.

Aşağıda tipik bir kaynak dosyası gösterilmektedir. Visual Studio'nun Pages yerleşik kaynak dosyası düzenleyicisi veya kaynak dosyalarını oluşturmak ve düzenlemek için bir uzantıya sahip Visual Studio Code gibi tümleşik bir geliştirme ortamıyla (IDE) yerleşik araçları kullanmamak isterseniz, kaynak dosyalarını uygulamanın klasörüne el ile yerleştirebilirsiniz.

Pages/CultureExample2.resx:

<?xml version="1.0" encoding="utf-8"?>
<root>
  <xsd:schema id="root" xmlns="" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
    <xsd:import namespace="http://www.w3.org/XML/1998/namespace" />
    <xsd:element name="root" msdata:IsDataSet="true">
      <xsd:complexType>
        <xsd:choice maxOccurs="unbounded">
          <xsd:element name="metadata">
            <xsd:complexType>
              <xsd:sequence>
                <xsd:element name="value" type="xsd:string" minOccurs="0" />
              </xsd:sequence>
              <xsd:attribute name="name" use="required" type="xsd:string" />
              <xsd:attribute name="type" type="xsd:string" />
              <xsd:attribute name="mimetype" type="xsd:string" />
              <xsd:attribute ref="xml:space" />
            </xsd:complexType>
          </xsd:element>
          <xsd:element name="assembly">
            <xsd:complexType>
              <xsd:attribute name="alias" type="xsd:string" />
              <xsd:attribute name="name" type="xsd:string" />
            </xsd:complexType>
          </xsd:element>
          <xsd:element name="data">
            <xsd:complexType>
              <xsd:sequence>
                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
                <xsd:element name="comment" type="xsd:string" minOccurs="0" msdata:Ordinal="2" />
              </xsd:sequence>
              <xsd:attribute name="name" type="xsd:string" use="required" msdata:Ordinal="1" />
              <xsd:attribute name="type" type="xsd:string" msdata:Ordinal="3" />
              <xsd:attribute name="mimetype" type="xsd:string" msdata:Ordinal="4" />
              <xsd:attribute ref="xml:space" />
            </xsd:complexType>
          </xsd:element>
          <xsd:element name="resheader">
            <xsd:complexType>
              <xsd:sequence>
                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
              </xsd:sequence>
              <xsd:attribute name="name" type="xsd:string" use="required" />
            </xsd:complexType>
          </xsd:element>
        </xsd:choice>
      </xsd:complexType>
    </xsd:element>
  </xsd:schema>
  <resheader name="resmimetype">
    <value>text/microsoft-resx</value>
  </resheader>
  <resheader name="version">
    <value>2.0</value>
  </resheader>
  <resheader name="reader">
    <value>System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
  </resheader>
  <resheader name="writer">
    <value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
  </resheader>
  <data name="Greeting" xml:space="preserve">
    <value>Hello, World!</value>
  </data>
</root>

Not

Aşağıdaki kaynak dosyası, klasöre sağ tıklayıp Pages Yeni Öğe>Kaynakları Dosyası Ekle>seçilerek Visual Studio'ya eklenebilir. Dosyayı CultureExample2.es.resx olarak adlandırın. Düzenleyici göründüğünde, yeni bir giriş için veri sağlayın. Name Greeting değerini ve Değerini olarak ¡Hola, Mundo!ayarlayın. Dosyayı kaydedin.

Visual Studio Code kullanıyorsanız Tim Heuer'in ResX Görüntüleyicisi ve Düzenleyicisi'ni yüklemenizi öneririz. Klasöre Pages boş CultureExample2.resx bir dosya ekleyin. Uzantı, kullanıcı arabiriminde dosyanın yönetimini otomatik olarak devralır. Yeni Kaynak Ekle düğmesini seçin. (anahtar), ¡Hola, Mundo! (değer) ve None (açıklama) için giriş eklemek için Greeting yönergeleri izleyin. Dosyayı kaydedin. Dosyayı kapatıp yeniden açarsanız, kaynağı görebilirsiniz Greeting .

Aşağıda tipik bir kaynak dosyası gösterilmektedir. Visual Studio'nun Pages yerleşik kaynak dosyası düzenleyicisi veya kaynak dosyalarını oluşturmak ve düzenlemek için bir uzantıya sahip Visual Studio Code gibi tümleşik bir geliştirme ortamıyla (IDE) yerleşik araçları kullanmamak isterseniz, kaynak dosyalarını uygulamanın klasörüne el ile yerleştirebilirsiniz.

Pages/CultureExample2.es.resx:

<?xml version="1.0" encoding="utf-8"?>
<root>
  <xsd:schema id="root" xmlns="" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
    <xsd:import namespace="http://www.w3.org/XML/1998/namespace" />
    <xsd:element name="root" msdata:IsDataSet="true">
      <xsd:complexType>
        <xsd:choice maxOccurs="unbounded">
          <xsd:element name="metadata">
            <xsd:complexType>
              <xsd:sequence>
                <xsd:element name="value" type="xsd:string" minOccurs="0" />
              </xsd:sequence>
              <xsd:attribute name="name" use="required" type="xsd:string" />
              <xsd:attribute name="type" type="xsd:string" />
              <xsd:attribute name="mimetype" type="xsd:string" />
              <xsd:attribute ref="xml:space" />
            </xsd:complexType>
          </xsd:element>
          <xsd:element name="assembly">
            <xsd:complexType>
              <xsd:attribute name="alias" type="xsd:string" />
              <xsd:attribute name="name" type="xsd:string" />
            </xsd:complexType>
          </xsd:element>
          <xsd:element name="data">
            <xsd:complexType>
              <xsd:sequence>
                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
                <xsd:element name="comment" type="xsd:string" minOccurs="0" msdata:Ordinal="2" />
              </xsd:sequence>
              <xsd:attribute name="name" type="xsd:string" use="required" msdata:Ordinal="1" />
              <xsd:attribute name="type" type="xsd:string" msdata:Ordinal="3" />
              <xsd:attribute name="mimetype" type="xsd:string" msdata:Ordinal="4" />
              <xsd:attribute ref="xml:space" />
            </xsd:complexType>
          </xsd:element>
          <xsd:element name="resheader">
            <xsd:complexType>
              <xsd:sequence>
                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
              </xsd:sequence>
              <xsd:attribute name="name" type="xsd:string" use="required" />
            </xsd:complexType>
          </xsd:element>
        </xsd:choice>
      </xsd:complexType>
    </xsd:element>
  </xsd:schema>
  <resheader name="resmimetype">
    <value>text/microsoft-resx</value>
  </resheader>
  <resheader name="version">
    <value>2.0</value>
  </resheader>
  <resheader name="reader">
    <value>System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
  </resheader>
  <resheader name="writer">
    <value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
  </resheader>
  <data name="Greeting" xml:space="preserve">
    <value>¡Hola, Mundo!</value>
  </data>
</root>

Aşağıdaki bileşen ile IStringLocalizer<T>yerelleştirilmiş Greeting dizenin kullanımını gösterir. Razor Aşağıdaki örnekteki işaretleme@Loc["Greeting"], önceki kaynak dosyalarında ayarlanan değere Greeting anahtarlanan dizeyi yerelleştirir.

ad alanını Microsoft.Extensions.Localization uygulamanın _Imports.razor dosyasına ekleyin:

@using Microsoft.Extensions.Localization

CultureExample2.razor:

@page "/culture-example-2"
@using System.Globalization
@inject IStringLocalizer<CultureExample2> Loc

<h1>Culture Example 2</h1>

<ul>
    <li><b>CurrentCulture</b>: @CultureInfo.CurrentCulture</li>
    <li><b>CurrentUICulture</b>: @CultureInfo.CurrentUICulture</li>
</ul>

<h2>Greeting</h2>

<p>
    @Loc["Greeting"]
</p>

<p>
    @greeting
</p>

@code {
    private string? greeting;

    protected override void OnInitialized()
    {
        greeting = Loc["Greeting"];
    }
}

İsteğe bağlı olarak, bileşen () içindeki gezintiye NavMenuNavMenu.razorbileşen için CultureExample2 bir menü öğesi ekleyin.

WebAssembly kültür sağlayıcısı başvuru kaynağı

Çerçevenin yerelleştirmeyi nasıl işlediğini Blazor daha fazla anlamak için ASP.NET Core başvuru kaynağındaki sınıfına bakınWebAssemblyCultureProvider.

Not

.NET başvuru kaynağına yönelik belge bağlantıları genellikle deponun varsayılan dalını yükler ve bu dal .NET'in sonraki sürümü için geçerli geliştirmeyi temsil eder. Belirli bir sürümün etiketini seçmek için Dalları veya etiketleri değiştir açılan listesini kullanın. Daha fazla bilgi için bkz. ASP.NET Core kaynak kodunun sürüm etiketini seçme (dotnet/AspNetCore.Docs #26205).

Paylaşılan kaynaklar

Yerelleştirme paylaşılan kaynakları oluşturmak için aşağıdaki yaklaşımı benimseyin.

  • Rastgele bir sınıf adıyla işlev dışı bir sınıf oluşturun. Aşağıdaki örnekte:

    • Uygulama ad alanını BlazorSample , yerelleştirme varlıkları ise ad alanını BlazorSample.Localization kullanır.
    • Kukla sınıfı olarak adlandırılır SharedResource.
    • Sınıf dosyası, uygulamanın kökündeki bir Localization klasöre yerleştirilir.

    Localization/SharedResource.cs:

    namespace BlazorSample.Localization;

public class SharedResource
{
}

  • Derleme Eylemi Embedded resourceile paylaşılan kaynak dosyalarını oluşturun. Aşağıdaki örnekte:

    • Dosyalar, dummy SharedResource sınıfıLocalization/SharedResource.cs () ile klasörüne yerleştirilirLocalization.

    • Kaynak dosyalarını, sahte sınıfın adıyla eşleşecek şekilde adlandırın. Aşağıdaki örnek dosyalar, varsayılan bir yerelleştirme dosyası ve İspanyolca (es) yerelleştirme için bir dosya içerir.

    • Localization/SharedResource.resx

    • Localization/SharedResource.es.resx

    Uyarı

    Bu bölümdeki yaklaşımı takip ederken kaynakları yüklemek için aynı anda ayarlayıp LocalizationOptions.ResourcesPath kullanamazsınız IStringLocalizerFactory.Create .

  • Bir bileşene eklenen IStringLocalizer<T> Razor bir bileşenin kukla sınıfına başvurmak için, yerelleştirme ad alanı için bir @using yönerge yerleştirin veya yerelleştirme ad alanını sahte sınıf başvurusuna ekleyin. Aşağıdaki örneklerde:

    • İlk örnek, bir @using yönergesi SharedResource ile kukla sınıfı için ad alanını belirtirLocalization.
    • İkinci örnek, sahte sınıfın SharedResource ad alanını açıkça belirtir.

    Bir Razor bileşende aşağıdaki yaklaşımlardan birini kullanın:

    @using Localization
@inject IStringLocalizer<SharedResource> Loc

    @inject IStringLocalizer<Localization.SharedResource> Loc

Ek yönergeler için bkz . ASP.NET Core'da genelleştirme ve yerelleştirme.

Geliştirici araçlarında "Algılayıcılar" bölmesini kullanarak konum geçersiz kılma

Google Chrome veya Microsoft Edge geliştirici araçlarındaki Algılayıcılar bölmesini kullanarak konum geçersiz kılmayı kullanırken, geri dönüş dili ön kayıt sonrasında sıfırlanır. Test sırasında Algılayıcılar bölmesini kullanarak dili ayarlamaktan kaçının. Tarayıcının dil ayarlarını kullanarak dili ayarlayın.

Daha fazla bilgi için bkz Blazor . Yerelleştirme InteractiveServer ile çalışmıyor (dotnet/aspnetcore #53707).

Ek kaynaklar