⏹️ 👩🏻‍⚖️ 🚜 التعريب في ASP.NET Core Razor Pages

مرحبا هابر! في الوقت الحالي ، تفتتح OTUS مجموعة في دورة جديدة "C # ASP.NET Core Developer" . في هذا الصدد ، نشارك معك عادةً ترجمة مفيدة وندعوك للاشتراك في يوم مفتوح ، يمكنك خلاله التعرف على تفاصيل الدورة التدريبية ، وكذلك طرح أسئلتك على الخبير.

هذه هي المقالة الأولى في سلسلة عن الترجمة في تطبيقات ASP.NET Core Razor Pages. في هذه المقالة ، سنلقي نظرة على التكوين المطلوب لإعداد موقع لتعريب المحتوى ، أو بعبارة أخرى ، لعولمة الموقع. في المقالات المستقبلية ، سأتحدث عن إنشاء محتوى مترجم وكيفية تقديمه للمستخدم النهائي.

العولمة في ASP.NET Core

تقوم العولمة بإعداد تطبيق لدعم لغات مختلفة حسب تفضيلات المستخدم. التعريب هو عملية تكييف محتوى موقع الويب مع مختلف البلدان أو المناطق أو الثقافات. نقطة البداية لعولمة تطبيق الويب هي القدرة على تحديد اللغة أو الثقافة لكل طلب. بعد ذلك ، نحتاج إلى آلية لاختيار المحتوى بناءً على ثقافة الطلب الحالي. في هذه المقالة ، سنلقي نظرة على الدور الذي يلعبه الفصل CultureInfoفي الأقلمة وكيف يمكنك تنفيذ مكون العرض بحيث يمكن للمستخدمين اختيار ثقافتهم المفضلة للاستعلامات.

Razor Pages , - ASP.NET Core 3.0 . «Localisation». , , .

1. Startup.cs using :

using System.Globalization;
using Microsoft.AspNetCore.Localization;
using Microsoft.Extensions.Options;

2. - . . ConfigureServices, AddLocalization, . RequestLocalizationOptions .

services.Configure<RequestLocalizationOptions>(options =>
{
   var supportedCultures = new[]
    {
        new CultureInfo("en"),
        new CultureInfo("de"),
        new CultureInfo("fr"),
        new CultureInfo("es"),
        new CultureInfo("ru"),
        new CultureInfo("ja"),
        new CultureInfo("ar"),
        new CultureInfo("zh"),
        new CultureInfo("en-GB")
    };
    options.DefaultRequestCulture = new RequestCulture("en-GB");
    options.SupportedCultures = supportedCultures;
    options.SupportedUICultures = supportedCultures;
});

, . .NET CultureInfo, , , , , . CultureInfo, , , (). - ISO 639-1, (, «en» ), ISO 3166, (, «en-GB» «en-ZA» ). , - , .

3. , RequestLocalizationOptions , , Configure app.UseRouting():

app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseRouting();

var localizationOptions = app.ApplicationServices.GetService<IOptions<RequestLocalizationOptions>>().Value;
app.UseRequestLocalization(localizationOptions);

, RequestCultureProviders. :

QueryStringRequestCultureProvider,

CookieRequestCultureProvider, cookie

AcceptHeadersRequestCultureProvider, Accept-Language

, . , . , , .

1. - Models CultureSwitcherModel.cs.

using System.Collections.Generic;
using System.Globalization;
 
namespace Localisation.Models
{
    public class CultureSwitcherModel
    {
        public CultureInfo CurrentUICulture { get; set; }
        public List<CultureInfo> SupportedCultures { get; set; }
    }
}

2. ViewComponents C# CultureSwitcherViewcomponent.cs. :

using Localisation.Models;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Localization;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Options;
using System.Linq;
 
namespace Localisation.ViewComponents
{
    public class CultureSwitcherViewComponent : ViewComponent
    {
        private readonly IOptions<RequestLocalizationOptions> localizationOptions;
        public CultureSwitcherViewComponent(IOptions<RequestLocalizationOptions> localizationOptions) =>
            this.localizationOptions = localizationOptions;
 
        public IViewComponentResult Invoke()
        {
            var cultureFeature = HttpContext.Features.Get<IRequestCultureFeature>();
            var model = new CultureSwitcherModel
            {
                SupportedCultures = localizationOptions.Value.SupportedUICultures.ToList(),
                CurrentUICulture = cultureFeature.RequestCulture.UICulture
            };
            return View(model);
        }
    }
}

3. Pages Components. CultureSwitcher. Razor View default.cshtml :

@model CultureSwitcherModel
 
<div>
    <form id="culture-switcher">
        <select name="culture" id="culture-options">
            <option></option>
            @foreach (var culture in Model.SupportedCultures)
            {
                <option value="@culture.Name" selected="@(Model.CurrentUICulture.Name == culture.Name)">@culture.DisplayName</option>
            }
        </select>
    </form>
</div>
 
 
<script>
    document.getElementById("culture-options").addEventListener("change", () => {
        document.getElementById("culture-switcher").submit();
    });
</script>

- select , , Startup. , , get , , culture. QueryStringRequestCultureProvider culture (/ ui-culture).

CurrentCulture . CurrentUICulture , , . , . CurrentCulture CurrentUICulture , , . (, ), .

4. , , - _ViewImports.cshtml using, , , tag- :

@using Localisation
@using Localisation.Models
@using System.Globalization
@namespace Localisation.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@addTagHelper *, Localisation

5. , tag-, .

<div class="navbar-collapse collapse d-sm-inline-flex flex-sm-row-reverse">
    <ul class="navbar-nav flex-grow-1">
        <li class="nav-item">
            <a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a>
        </li>
        <li class="nav-item">
            <a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a>
        </li>
    </ul>
</div>
<vc:culture-switcher/>

6. Index.cshtml, HTML- , :

@page
@using Microsoft.AspNetCore.Localization
@model IndexModel
@{
    ViewData["Title"] = "Home page";
    var requestCultureFeature = HttpContext.Features.Get<IRequestCultureFeature>();
    var requestCulture = requestCultureFeature.RequestCulture;
}
 
<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
 
    <table class="table culture-table">
        <tr>
            <td style="width:50%;">Culture</td>
            <td>@requestCulture.Culture.DisplayName {@requestCulture.Culture.Name}</td>
        </tr>
        <tr>
            <td>UI Culture</td>
            <td>@requestCulture.UICulture.Name</td>
        </tr>
        <tr>
            <td>UICulture Parent</td>
            <td>@requestCulture.UICulture.Parent</td>
        </tr>
        <tr>
            <td>Date</td>
            <td>@DateTime.Now.ToLongDateString()</td>
        </tr>
        <tr>
            <td>Currency</td>
            <td>
                @(12345.00.ToString("c"))
            </td>
        </tr>
        <tr>
            <td>Number</td>
            <td>
                @(123.45m.ToString("F2"))
            </td>
        </tr>
    </table>
</div>

AcceptHeadersCultureRequestProvider. , QueryStringCultureRequestProvider. ui-culture culture (, https://localhost:xxxxx/?culture=es&ui-culture=de), , .

Razor Pages. , , , . , . , .

, , , , . , (.resx) .

:

GRPC ASP.NET CORE 3.0

التعريب في ASP.NET Core Razor Pages - الثقافات

العولمة في ASP.NET Core

:

More articles: