私は現在、SPA の多言語化の問題に取り組んでいます。
リソースの resx ファイルのラッパーを作成したり、すべてのラベルをデータベースに保存したりするなど、いくつかの解決策を思いつきましたが、これらの手順を自動化する解決策を見つけた人がいるかどうか疑問に思っています。
この問題に固有のプラクティスはありますか?
私は現在、SPA の多言語化の問題に取り組んでいます。
リソースの resx ファイルのラッパーを作成したり、すべてのラベルをデータベースに保存したりするなど、いくつかの解決策を思いつきましたが、これらの手順を自動化する解決策を見つけた人がいるかどうか疑問に思っています。
この問題に固有のプラクティスはありますか?
妥当な量のリテラルについては、リソースを DB またはサーバーの .RESX ファイルに保存することをお勧めします。ユーザーがログインするか、使用される言語を検出すると、アプリケーションによってリテラルが要求され、翻訳モジュールのコレクションまたはブラウザーの LocalStorage に保存されます (これは、大きなデータの場合に適した方法です)。 . 次に、このモジュールには、メッセージを取得するためのいくつかのメソッドがあり、おそらくキーを渡します。
このソリューションを使用すると、翻訳されたリテラルを表示する必要があるビューモデルにこのモジュールを挿入し、ビューを介してそれらにアクセスできます。
<p data-bind="text: resourceManager.get('M01')"></a>
大量のローカリゼーション データを転送する必要がある大規模なアプリケーションの場合、ある種のモジュール性を適用して、各モジュール/セクションに本当に必要なリソースのみをロードすることができます。
翻訳されたリテラルを取得するためにサーバーに繰り返しリクエストを行うことは良い習慣ではないと思います。SPA は優れたユーザー エクスペリエンスを提供する必要があり、翻訳されたリテラルをサーバーから読み込むと、ブロックの問題が発生する可能性があります。テキストは画像とは異なります。すべての画像をロードせずにページをレンダリングできます。テキストなしでページをレンダリングすることを想像してみてください:o
とにかく、サーバーをリポジトリとして保持し、1回または複数回のロードでデータを取得し、クライアントのどこかに保存できるカスタムJSモジュールを作成するのが最善の解決策だと思います.
カスタムバインディングとi18nextを使用して、私自身の問題を解決しました。
まず、ラベル/ボタンやその他のリソースの翻訳のためにi18nextを実装しました。
次に、カスタム Knockout bindingHandler を追加しました。
ko.bindingHandlers.i18n = {
init: function (element, valueAccessor) {
var translateKey = valueAccessor();
ko.utils.setTextContent(element, $.t(translateKey));
}
};
最後に、次のコードをビューに追加できます。
<span data-bind="i18n : 'buttons.cancel'"></span>
これにより、正しいリソースが自動的に取得され、Knockout がバインディングを処理します。
うまくいけば、これは同じ問題に苦しんでいる他の人を助けるでしょう.