ASP.NET hiển thị chuyển đổi đa ngôn ngữ với các tính năng tích hợp của MVC lõi

Trang Cập Nhật :
Ngày tạo trang :

Môi trường

Visual Studio-giường
  • Visual Studio 2019
ASP.NET lõi
  • 3,0
  • 3,1

Lúc đầu

ASP.NET sử dụng lõi MVC tính năng bản địa hoá để chuyển đổi giữa nhiều ngôn ngữ để hiển thị chúng.

Tạo tệp nguồn cho văn bản đã dịch

Tạo một thư mục để lưu trữ các tập tin tài nguyên (Resx) quản lý văn bản. Vị trí là bất cứ nơi nào, nhưng để nó trực tiếp dưới tuyến đường. Đường dẫn này cũng ảnh hưởng đến các thiết đặt sau.

Bấm chuột phải vào dự án và chọn thêm hoặc thư mục mới.

image

Để lại các tài nguyên tên thư mục. Bạn cũng có thể đặt tên thư mục này tùy chỉnh, nhưng bạn có thể chỉ định tên thư mục này trong cài đặt sau.

image

Sau đó, tạo một tập tin nguồn lực để nhập văn bản cho mỗi ngôn ngữ.

Bấm chuột phải vào thư mục tài nguyên và chọn thêm hoặc mục mới.

image

Chọn tệp nguồn (. resx). Tên tệp có thể tùy ý, nhưng nó phải khớp với tên bạn chỉ định sau. Để bây giờ, hãy nói SharedResource. resx.

image

Sau khi bạn tạo tệp. resx, bấm đúp để mở, và sau đó nhập tên xác định văn bản và văn bản mà bạn muốn thực sự hiển thị. Tệp SharedResource. resx là tệp được sử dụng nếu ngôn ngữ không tồn tại. Tôi đã nhập nó vào Nhật bản ở đây. Nếu bạn muốn các ngôn ngữ khác, chẳng hạn như tiếng Anh, là mặc định, hãy nhập chúng vào ngôn ngữ đó.

Ở đây chúng tôi nhập hello và Goodbye như mẫu. Lưu ý rằng nó là trường hợp nhạy cảm.

image

Tiếp tục tạo tệp nguồn cho các ngôn ngữ khác. Để xác định ngôn ngữ, chỉ định tên tệp, chẳng hạn như mã văn hóa Sharedresource. < >. resx. Bạn có thể chỉ định một hoặc cả hai kết hợp của ISO 639 và ISO 3166 cho mã văn hóa. Mã hỗ trợ có thể thay đổi theo thời gian, vì vậy lớp Cultureinfo trên trang web của Microsoft Vui lòng tham khảo trang.

Thời gian này, en (tiếng Anh) và ES (Tây Ban Nha) được chuẩn bị. Nhật bản không có sẵn vì nó là mặc định.

image

Nhập văn bản đã dịch với các phím trong cùng một trạng thái cho mỗi tệp.

image

image

Tiếp theo, bạn sẽ có một tập tin xác định chỉ các lớp học. Bạn tạo này có cùng tên với tệp nguồn bạn vừa tạo.

Trong thực tế, tôi không quan tâm những gì tên của tập tin mã chính nó là bởi vì bạn chỉ có để phù hợp với tên của lớp bên trong, nhưng để nó giống nhau để nó rất dễ hiểu. Nó không quan trọng nơi bạn muốn viết mã.

image

Làm cho không gian tên gốc của dự án và tạo ra một lớp trống.

namespace LocalizationText
{
  // クラス名は作成した .resx のファイル名と同じにする必要がある
  public class SharedResource { }
}

Sửa chữa mỗi chương trình

Startup.cs

Sửa chữa Startup.CS. Mô tả phương thức ConfigureServices như sau:

Dịch vụ. AddMvc (). Nếu có một phương pháp AddViewLocalization, văn bản được dịch bởi cả hai bên View và phía Controller là Tôi chắc rằng tôi có thể nhận được nó, nhưng Cũng như trên các dịch vụ trang web chính thức. Không có vấn đề với việc gọi phương pháp AddLocalization với nhau.

Tùy chọn. ResourcesPath chỉ định đường dẫn thư mục nơi tệp Resx nằm. Nếu cả hai được quy định, Dịch vụ. AddMvc (). Phương pháp AddViewLocalization nhận ưu tiên.

public void ConfigureServices(IServiceCollection services)
{
  services.AddControllersWithViews();

  // Resx ファイルのあるフォルダを指定する。
  // コントローラー側でしか使用しないならこちらでもよい。AddViewLocalization を使用するならこちらはなくても動作する。
  //services.AddLocalization(options => options.ResourcesPath = "Resources");

  services.AddMvc()
    // ローカライズに必要。Resx ファイルのフォルダパスを指定
    .AddViewLocalization(LanguageViewLocationExpanderFormat.Suffix, opts => { opts.ResourcesPath = "Resources"; });
}

Sau đó sửa đổi phương pháp đặt cấu hình cho Startup.CS. Nếu bạn chỉ muốn đọc tập tin tài nguyên, bạn không cần nó. Mã cần thiết để cho phép người dùng chỉ định một ngôn ngữ tùy thuộc.

Chúng tôi đang sử dụng các tính năng được xây dựng trong ASP.NET Core MVC là tiêu chuẩn. Mã sau đây mô tả "chuỗi truy vấn", "cookie" và "chấp nhận-ngôn ngữ HTTP tiêu đề" tùy thuộc vào môi trường của người dùng. Bạn có thể chuyển đổi giữa các ngôn ngữ hiển thị trong một trong số chúng. Chúng tôi sẽ nhìn thấy bạn sau này làm thế nào để kiểm tra hoạt động thực tế.

Ngôn ngữ switchable được xác định ở đây trong mảng (Supportedvăn hóa). Tôi chỉ định Ja là ngôn ngữ mặc định, nhưng tôi đã không tạo ra các tập tin Ja thời gian này. SharedResource. resx được sử dụng nếu một ngôn ngữ khác en, Es được chỉ định.

Bạn có thể tách các giao diện người dùng từ các ngôn ngữ bạn hỗ trợ, nhưng không có nhiều lợi ích để tách nó. Bạn có cùng một ngôn ngữ.

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
  if (env.IsDevelopment())
  {
    // 省略
  }

  // 標準の機能で切り替えたい言語を定義します。
  var supportedCultures = new[]
  {
    new CultureInfo("ja"),
    new CultureInfo("en"),
    new CultureInfo("es"),
  };

  // 標準の言語切り替え機能を有効にします。対応しているのは「クエリ文字列」「Cookie」「Accept-Language HTTP ヘッダー」です。
  app.UseRequestLocalization(new RequestLocalizationOptions
  {
    DefaultRequestCulture = new RequestCulture("ja"),
    SupportedCultures = supportedCultures,
    SupportedUICultures = supportedCultures
  });

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

  // 省略
}

Controllers\HomeController.cs

Controllers\homecontroller.CS tệp. Để có được một ngôn ngữ bản địa hóa ở phía Controller, iStringLocalizer được nhận trong constructor. SharedResource phải có cùng tên với lớp mà bạn đã tạo trước đó. Văn bản được chuyển đến các nhập khẩu của Localizer nhận được bằng cách đi qua các chuỗi khóa vào trong tập tin tài nguyên. có thể được lấy. Ngôn ngữ của văn bản được xác định dựa trên nền văn hóa được yêu cầu.

By the Way, ngoài IStringLocalizer, đó cũng là một IHtmlLocalizer có thể nhận được HTML như nó được.

public class HomeController : Controller
{
  private readonly ILogger<HomeController> _logger;
  private readonly IStringLocalizer<SharedResource> _localizer;

  // DI でローカライザーを取得します。
  public HomeController(ILogger<HomeController> logger, IStringLocalizer<SharedResource> localizer)
  {
    _logger = logger;
    _localizer = localizer;
  }

  public IActionResult Index()
  {
    // ローカライザーを使用して設定されている言語のリソースファイルからテキストを取得します。
    ViewData["Message"] = _localizer["Goodbye"];

    return View();
  }

  // 省略
}

Lượt xem \ _ViewImports. cshtml

Xem \ _ViewImports. cshtml tập tin. Để sử dụng một Localizer ở bên xem, bạn phải tiêm IHtmlLocalizer. Nếu bạn mô tả nó như sau cho bây giờ, nó là OK. Ngoài ra, SharedResource phải có cùng tên với tệp nguồn và lớp bạn đã tạo trước đó.

IHtmlLocalizer là trong không gian tên Microsoft. AspNetCore. MVC. localization, vì vậy tôi sẽ xác định điều này là sử dụng.

Nếu bạn chỉ muốn sử dụng Localizer tại một điểm nhất định, bạn có thể bao gồm mã sau trong tệp dạng xem riêng. Nếu bạn viết nó trong một tập tin _ViewImports. cshtml, bạn sẽ tự động có thể sử dụng nó trong tất cả các file View.

@using LocalizationText
@using LocalizationText.Models
@using Microsoft.AspNetCore.Mvc.Localization
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@* ビュー側でローカライザーを使用できるように定義します *@
@inject IHtmlLocalizer<SharedResource> Localizer

Views\Home\Index.cshtml

Views\home\index.cshtml tệp. Các văn bản thu được ở phía bên điều khiển và văn bản thu thập trực tiếp ở phía xem sẽ hiển thị tương ứng. Localizer xem bên cũng được các văn bản bằng cách xác định một chuỗi phím cho các Indexer.

@{
    ViewData["Title"] = "Home Page";
}

<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>
</div>

@* ローカライザーから取得したテキストを表示します。 *@
<p>@Localizer["Hello"]</p>
<p>@ViewData["Message"]</p>

Kiểm tra hoạt động

Chuỗi truy vấn

Bạn có thể chuyển đổi ngôn ngữ hiển thị bằng cách chỉ định một mã văn hóa trong chuỗi truy vấn của URL. Định dạng là ? văn hóa = < mã văn hóa >. Nếu bạn muốn tách nó ra khỏi giao diện người dùng, nó sẽ được ? văn hóa = < mã văn hóa > & UI-Culture = mã văn hóa < >.

Nếu bạn không chỉ định bất cứ điều gì: Nếu không xác định, SharedResource. resx được sử dụng. (Trong thực tế, bản án khác đã được áp dụng...)

image

Mô hình quy định cho ? văn hóa = en. Ngôn ngữ hiển thị là tiếng Anh.

image

Các mô hình quy định cho ? văn hóa = es. Ngôn ngữ hiển thị là tiếng Tây Ban Nha.

image

Các mô hình quy định cho ? văn hóa = Ja. Ban đầu, tệp SharedResource. Ja. resx được sử dụng. SharedResource. resx được sử dụng bởi vì nó không tồn tại.

image

Cố gắng chỉ định một ngôn ngữ không tồn tại. SharedResource. resx được sử dụng vì không có tệp tương ứng ở đây.

image

Cookie

Cookie có thể chuyển đổi ngôn ngữ hiển thị. Thông thường xuất bản từ phía máy chủ, nhưng lần này tôi sẽ cố gắng đăng ký cookie trực tiếp trong chức năng trình duyệt.

Bởi vì mỗi trình duyệt web có một công cụ phát triển, bạn sử dụng nó để đăng ký cookie. Trong hình bên dưới, bạn có thể nhấn F12 trên Edge để hiển thị các công cụ dành cho nhà phát triển.

Tên của cookie tương ứng là . AspNetCore. culture, và giá trị chỉ định ngôn ngữ là Nhập vào các hình thức của c = < mã văn hóa > | UIC = < mã văn hóa >. Đối với cookie, bạn cũng phải nhập mã giao diện người dùng. Một khi bạn đã đăng ký cookie của bạn, làm mới trang trình duyệt web của bạn để làm mới nó. Một cookie được gửi đến máy chủ để máy chủ sẽ lấy ngôn ngữ đã chỉ định.

Trong hình dưới đây, bạn có thể nhập c = en | UIC = en để hiển thị tiếng Anh.

image

loại c = es | UIC = es để hiển thị tiếng Tây Ban Nha.

image

Tiêu đề HTTP chấp nhận ngôn ngữ

Tiêu đề chấp nhận ngôn ngữ HTTP kiểm tra thông tin tiêu đề yêu cầu từ trình duyệt web vào máy chủ. Đó là khả năng chuyển đổi ngôn ngữ cho phù hợp.

Bạn có thể gửi bất kỳ Accept-Language trong cài đặt trình duyệt web của bạn, nhưng theo mặc định, bạn có thể phù hợp với cài đặt ngôn ngữ OS. Chấp nhận-ngôn ngữ bây giờ được gửi. (Cho dù nó có thực sự được gửi phụ thuộc vào hệ điều hành và trình duyệt web hay không.) Ngôn ngữ được khởi tạo trong trình duyệt web cho ngôn ngữ của hệ điều hành, nhưng nó có thể chính xác.)

Vì vậy, ví dụ, như được hiển thị trong hình dưới đây, bạn có thể mở trang trong trình duyệt web của hệ điều hành tiếng Anh ngôn ngữ và gửi thông tin vi, vì vậy bạn có thể tự động SharedResource. en. resx được chọn để hiển thị tiếng Anh.

image

Nếu bạn cố gắng chỉ định một ngôn ngữ không tồn tại trong chuỗi truy vấn, bạn nên sử dụng SharedResource. resx. Chấp nhận ngôn ngữ hiển thị tiếng Anh vì en tồn tại.

image

Nếu Ja được chỉ định trong chuỗi truy vấn, Chuỗi truy vấn có ưu tiên và tiếng Nhật được hiển thị.

image

Tóm tắt

Ở đây tôi đã cố gắng để thực hiện chuyển đổi đa ngôn ngữ trong cách dễ nhất. Để chuyển đổi ngôn ngữ cho phù hợp với môi trường của người dùng, hãy sử dụng tiêu đề HTTP chấp nhận ngôn ngữ làm ngôn ngữ hiển thị mặc định. Nếu người dùng chọn bất kỳ ngôn ngữ nào, đó là một ý tưởng tốt để thêm cookie hoặc thêm (hoặc nhập trực tiếp) của chuỗi truy vấn.