web-dev-qa-db-ja.com

文字列とラベルのローカライズとグローバル化のベストプラクティス

私は20人以上の開発者がいるチームのメンバーです。各開発者は個別のモジュール（10個のモジュールに近いもの）で作業します。各モジュールには、少なくとも50個のCRUDフォームがあります。つまり、現在500個近くボタンを追加、ボタンを保存、ボタンを編集、等.

ただし、アプリケーションをグローバル化するため、アプリケーション内のテキストを翻訳できる必要があります。たとえば、フランス語のユーザーの場合、どこでもaddはajouterになります。

これまでに行ったことは、UIまたはプレゼンテーションレイヤーの各ビューに対して、翻訳のキー/値ペアの辞書があることです。次に、ビューのレンダリング中に、この辞書を使用して必要なテキストと文字列を翻訳します。ただし、このアプローチでは、500の辞書で500 addに近い値が得られるようになりました。これは、DRYプリンシパルに違反したことを意味します。

一方、addを1か所に配置して、どこでも使用するように開発者に依頼するなど、一般的な文字列を集中化すると、文字列が集中化で既に定義されているかどうかがわからないという問題が発生します辞書かどうか。

他のオプションの1つは、翻訳辞書を持たず、Google翻訳、Bing Translatorなどのオンライン翻訳サービスを使用することです。

私たちが遭遇した別の問題は、プロジェクトを予定通りに配信するというストレスにさらされている一部の開発者が翻訳キーを思い出せないことです。たとえば、追加ボタンのテキストの場合、開発者はaddを使用し、別の開発者はnewなどを使用しています。

アプリケーションの文字列リソースのグローバリゼーションとローカリゼーションのためのベストプラクティス、または最もよく知られている方法は何ですか？

javascriptlocalizationtranslationclient-sideglobalization
103
user1968030

私の知る限り、JavaScriptのローカライズと国際化のためのlocaleplanetという優れたライブラリがあります。さらに、ネイティブであり、他のライブラリ（jQueryなど）に依存していないと思います

これが図書館のウェブサイトです： http://www.localeplanet.com/

また、Mozillaによるこの記事をご覧ください。クライアント側の翻訳のための非常に優れた方法とアルゴリズムを見つけることができます。 http://blog.mozilla.org/webdev/2011/10/06/i18njs-internationalize-your- javascript-with-a-little-help-from-json-and-the-server /

これらすべての記事/ライブラリの共通部分は、getをkeyに取得/変換するためにi18nクラスとvalueメソッド（いくつかの方法で_などの小さな関数名も定義する）を使用することです。私の説明では、keyは翻訳したい文字列を意味し、valueは翻訳された文字列を意味します。
次に、keyとvalueを保存するためのJSONドキュメントが必要です。

例えば：

var _ = document.webL10n.get;
alert(_('test'));

そして、ここでJSON：

{ test: "blah blah" }

現在人気のあるライブラリソリューションを使用することは良いアプローチだと思います。

47
Afshin Mehrabani

あなたが解決すべき問題に直面しているとき（そして、率直に言って、最近は誰ではないのですか？）、私たちコンピューターの人々が通常とる基本的な戦略は「分割統治」と呼ばれます。

  • 特定の問題を小さなサブ問題のセットとして概念化します。
  • それぞれの小さな問題を解決します。
  • 結果を特定の問題のソリューションに結合します。

しかし、可能な戦略は「分割征服」だけではありません。より一般的なアプローチを取ることもできます。

  • 特定の問題をより一般的な問題の特殊なケースとして概念化します。
  • どういうわけか、一般的な問題を解決します。
  • 一般的な問題の解決策を特定の問題に適合させます。

-Eric Lippert

ASP.Net/C#などのサーバー側言語では、この問題に対する多くのソリューションが既に存在していると思います。

私は問題の主要な側面のいくつかを概説しました

  • Issue：目的の言語のデータのみをロードする必要があります

    Solution：この目的のために、各言語の個別のファイルにデータを保存します

例res.de.js、res.fr.js、res.en.js、res.js（デフォルト言語用）

  • 問題：各ページのリソースファイルを分離して、必要なデータのみを取得する必要がある

    Solution： https://github.com/rgrove/lazyload のような既存のツールを使用できます

  • 問題：データを保存するにはキーと値のペア構造が必要です

    Solution：string/string airではなくjavascriptオブジェクトをお勧めします。 IDEからインテリセンスの恩恵を受けることができます

  • 問題：一般メンバーは公開ファイルに保存され、すべてのページがそれらにアクセスする必要があります

    Solution：この目的で、Global_Resourcesという名前のWebアプリケーションのルートにフォルダーを作成し、名前を付けた各サブフォルダーのグローバルファイルを保存するフォルダーを作成します ' Local_Resources '

  • 問題：各サブシステム/サブフォルダー/モジュールメンバーは、スコープのGlobal_Resourcesメンバーをオーバーライドする必要があります

    Solution：それぞれのファイルを検討しました

アプリケーション構造

root/
    Global_Resources/
        default.js
        default.fr.js
    UserManagementSystem/
        Local_Resources/
            default.js
            default.fr.js
            createUser.js
        Login.htm
        CreateUser.htm

ファイルに対応するコード：

Global_Resources/default.js

var res = {
    Create : "Create",
    Update : "Save Changes",
    Delete : "Delete"
};

Global_Resources/default.fr.js

var res = {
    Create : "créer",
    Update : "Enregistrer les modifications",
    Delete : "effacer"
};

目的の言語のリソースファイルは、Global_Resourceから選択したページにロードする必要があります。これは、すべてのページにロードする最初のファイルでなければなりません。

UserManagementSystem/Local_Resources/default.js

res.Name = "Name";
res.UserName = "UserName";
res.Password = "Password";

UserManagementSystem/Local_Resources/default.fr.js

res.Name = "nom";
res.UserName = "Nom d'utilisateur";
res.Password = "Mot de passe";

UserManagementSystem/Local_Resources/createUser.js

// Override res.Create on Global_Resources/default.js
res.Create = "Create User";

UserManagementSystem/Local_Resources/createUser.fr.js

// Override Global_Resources/default.fr.js
res.Create = "Créer un utilisateur";

manager.jsファイル（このファイルは最後にロードする必要があります）

res.lang = "fr";

var globalResourcePath = "Global_Resources";
var resourceFiles = [];

var currentFile = globalResourcePath + "\\default" + res.lang + ".js" ;

if(!IsFileExist(currentFile))
    currentFile = globalResourcePath + "\\default.js" ;
if(!IsFileExist(currentFile)) throw new Exception("File Not Found");

resourceFiles.Push(currentFile);

// Push parent folder on folder into folder
foreach(var folder in parent folder of current page)
{
    currentFile = folder + "\\Local_Resource\\default." + res.lang + ".js";

    if(!IsExist(currentFile))
        currentFile = folder + "\\Local_Resource\\default.js";
    if(!IsExist(currentFile)) throw new Exception("File Not Found");

    resourceFiles.Push(currentFile);
}

for(int i = 0; i < resourceFiles.length; i++) { Load.js(resourceFiles[i]); }

// Get current page name
var pageNameWithoutExtension = "SomePage";

currentFile = currentPageFolderPath + pageNameWithoutExtension + res.lang + ".js" ;

if(!IsExist(currentFile))
    currentFile = currentPageFolderPath + pageNameWithoutExtension + ".js" ;
if(!IsExist(currentFile)) throw new Exception("File Not Found");

それが役に立てば幸い ：）

41
Omid Shariati

jQuery.i18nは、Webページで国際化を有効にするための軽量のjQueryプラグインです。 Java Resource Bundlesと同様に、カスタムリソース文字列を「.properties」ファイルにパッケージ化できます。提供された言語またはブラウザによって報告された言語に基づいて、リソースバンドル（.properties）をロードおよび解析します。

これについて詳しく知るには、 JQueryを使用してページを国際化する方法 をご覧ください。

12
BalaKrishnan웃