使用 cookie 预渲染 Blazor Wasm 应用程序中的全球化和本地化答案

【问题标题】：Globalization and Localization in Pre-rendering Blazor Wasm App using cookies使用 cookie 预渲染 Blazor Wasm 应用程序中的全球化和本地化
【发布时间】：2021-06-09 22:22:55
【问题描述】：

我找不到任何参考/解决方案来通过预呈现应用程序中的 cookie 在 Blazor 应用程序中设置文化。

请帮我找一个。

【问题讨论】：

标签： blazor blazor-webassembly culture prerender

【解决方案1】：

我遇到了同样的问题并想出了一个解决方案。这不是最好的，但它有效：

首先我在服务器项目的progam.cs中配置了本地化（假设是.net 6）：

builder.Services.AddLocalization();
...
...
string[] cultures = {"de","en","nl" };
app.UseRequestLocalization(new RequestLocalizationOptions()
    .SetDefaultCulture(cultures.First())
    .AddSupportedCultures(cultures)
    .AddSupportedUICultures(cultures));

在 _host.cshtml（也在服务器上）中，您可以拦截初始请求以自定义当前文化。例如检查查询字符串值或首选语言 cookie。

@page "/"
@namespace blazor.Client
@using System.Globalization
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
   Layout = "_Layout";
 

   //use the default culture from server initials request
   var requestCulture = CultureInfo.CurrentCulture.Name;
   //get culture from querystring
   if (Request.Query.ContainsKey("culture"))
   {
       var lang = Request.Query["culture"].ToString();
       requestCulture = lang;
       //todo: place language cookie
   }
   //get culture from cookie
   if (Request.Cookies.TryGetValue(CookieRequestCultureProvider.DefaultCookieName, out var value))
   {
       var fromCookie = CookieRequestCultureProvider.ParseCookieValue(value).Cultures.First().Value;
       requestCulture = fromCookie;
   }

然后将当前区域性传递给 App 组件（也在 _host.cshtml 中）

<component 
           type="typeof(App)"
           param-SelectedCulture="requestCulture"
           render-mode="WebAssemblyPrerendered" />

自定义文化通过 'param-SelectedCulture' 作为字符串值传递给 App 组件。

在 app.razor 中，您可以将此值分配给 CurrentInfo.DefaultThread，如下所示：

@using System.Globalization

<AppState>
    <Router AppAssembly="@typeof(App).Assembly">
        <Found Context="routeData">
            <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
            <FocusOnNavigate RouteData="@routeData" Selector="h1" />
        </Found>
        <NotFound>
            <PageTitle>Not found</PageTitle>
            <LayoutView Layout="@typeof(MainLayout)">
                <p role="alert">Sorry, there's nothing at this address.</p>
            </LayoutView>
        </NotFound>
    </Router>
</AppState>

@code {
    [Parameter] public string SelectedCulture { get; set; } = default!;
    protected override void OnAfterRender(bool firstRender)
    {
        if (firstRender)
        {
            var selectedCulture = new CultureInfo(SelectedCulture);
            CultureInfo.DefaultThreadCurrentCulture = selectedCulture;
            CultureInfo.DefaultThreadCurrentUICulture = selectedCulture;
        }
    }
}

在您的客户端应用程序中，您可以在用户选择其他语言后设置语言 cookie。然后设置cookie，重新加载页面

navigationmanager.navigateto("/",true)

【讨论】：