Blazor wasm Localization
See original GitHub issueDescribe the bug
Localization for Blazor wasm does not work correctly, if user uses Blazor + Asp.Net core host + IdentityServer. In documentation for Blazor I found an example for localization in wasm (LocSample). Is this project wasm hasn’t any extra hosts and everything work perfect. In my project I use 4 culture: en, de (or de-DE), fr, ru. Firefox and Edge shows the translation only for en (because it’s standard language from a *.resx file) and russian. Google Chrome shows translation correctly for all languages.
To Reproduce
- VS -> create new project => blazor => wasm + asp.net core hosted + Identity
- Add nuget package “Microsoft.Extensions.Localization - 3.1.3”
- Add in Program.cs to set the culture:
builder.Services.AddLocalization();
var host = builder.Build();
var jsInterop = host.Services.GetRequiredService<IJSRuntime>();
var result = await jsInterop.InvokeAsync<string>("blazorCulture.get");
if (result != null)
{
var culture = new CultureInfo(result);
CultureInfo.DefaultThreadCurrentCulture = culture;
CultureInfo.DefaultThreadCurrentUICulture = culture;
}
- Create some resources for a component: Counter.resx, Counter.de.resx, Counter.ru.resx
- Add code to index.html to store user culture
<script>
window.blazorCulture = {
get: () => window.localStorage['BlazorCulture'],
set: (value) => window.localStorage['BlazorCulture'] = value
};
</script>
- Add code to Counter.razor, to select culture and show result
@using System.Globalization
@inject IJSRuntime JSRuntime
@inject NavigationManager Nav
@inject Microsoft.Extensions.Localization.IStringLocalizer<Counter> Loc
<h1>@Loc["String1"]</h1>
<h1>@Loc["String1"]</h1>
<select @bind="Culture">
@foreach (var culture in supportedCultures)
{
<option value="@culture">@culture.DisplayName</option>
}
</select>
@code {
CultureInfo[] supportedCultures = new[]
{
new CultureInfo("en"),
new CultureInfo("de"),
new CultureInfo("ru"),
};
CultureInfo Culture
{
get => CultureInfo.CurrentCulture;
set
{
if (CultureInfo.CurrentCulture != value)
{
var js = (IJSInProcessRuntime)JSRuntime;
js.InvokeVoid("blazorCulture.set", value.Name);
Nav.NavigateTo(Nav.Uri, forceLoad: true);
}
}
}
}
Only Chrome shows right translation.
Code: https://github.com/tj-jyk/BlazorApp4
Further technical details
- Microsoft Windows [Version 10.0.18362.778] (Ru. Pro)
- dotnet --info
Version: 3.1.201
Commit: b1768b4ae7
OS Name: Windows
OS Version: 10.0.18362
OS Platform: Windows
RID: win10-x64
Base Path: C:\Program Files\dotnet\sdk\3.1.201\
Host (useful for support):
Version: 3.1.3
Commit: 4a9f85e9f8
.NET Core SDKs installed:
3.1.100 [C:\Program Files\dotnet\sdk]
3.1.102 [C:\Program Files\dotnet\sdk]
3.1.201 [C:\Program Files\dotnet\sdk]
.NET Core runtimes installed:
Microsoft.AspNetCore.All 2.1.17 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.All]
Microsoft.AspNetCore.App 2.1.17 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
Microsoft.AspNetCore.App 3.1.0 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
Microsoft.AspNetCore.App 3.1.2 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
Microsoft.AspNetCore.App 3.1.3 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App]
Microsoft.NETCore.App 2.1.17 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
Microsoft.NETCore.App 3.1.0 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
Microsoft.NETCore.App 3.1.2 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
Microsoft.NETCore.App 3.1.3 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]
Microsoft.WindowsDesktop.App 3.1.0 [C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App]
Microsoft.WindowsDesktop.App 3.1.2 [C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App]
Microsoft.WindowsDesktop.App 3.1.3 [C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App]
- The IDE (Microsoft Visual Studio Community 2019 16.5.4)
Issue Analytics
- State:
- Created 3 years ago
- Comments:10 (6 by maintainers)
Top Results From Across the Web
ASP.NET Core Blazor globalization and localization
This article explains how to render globalized and localized content to users in different cultures and languages. For globalization, Blazor ...
Read more >Localized Application in Blazor WebAssembly
Localization is the process of customizing applications to display and operate in a specific language UI. This can be implemented in Blazor ......
Read more >Localization in Blazor WebAssembly Applications
Localization is the process of adapting our globalized application which is already prepared to support localizability. This means that we want ...
Read more >Blazor WebAssembly I18n from Start to Finish
WebAssembly (abbreviated as Wasm) is a low-level assembly-like language that has a compact-binary format and can run on all modern web browsers.
Read more >Localization (Multi-Language) in Blazor components
Localization is the process of translating the application resources into different languages for specific cultures. You can localize the Syncfusion Blazor ...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
@pranavkm no it was from here https://www.mozilla.org/ru/firefox/download/thanks/
Fixed as part of https://github.com/dotnet/aspnetcore/commit/9e412f4c7f0bf6f0e43db27a17bc938c36160f41