Dojoは国際化にも対応

Dojoは、Javaのjava.util.ResourceBundleに似た国際化フレームワークを備えている。この枠組みに従うと、Dojoが認識したロケールに従って、アプリケーション内の文字列が自動的に切り替わるようになる。

前提条件

国際化されたアプリケーションを作成するための第一歩は、アプリケーション内の文字列を外部化し、対応する言語ごとにファイルを分けて用意することだ。

Dojoでは、そうした国際化されたリソースをdojo.require()と同じ仕組みで読み込むため、リソースはモジュールパス内に存在する必要がある。

後でまた説明するが、リソースを読み込むためのメソッドは「dojo.requireLocalization()」だ。

 // mycomパッケージ内のhelloMessageリソースを読み込む。
 dojo.requireLocalization("mycom", "helloMessage");

今回は上の例で示した通り、「mycomパッケージ内のhelloMessageリソースを読み込む」ことにする。

前準備

では、国際化されたリソースを用意しよう。今回は、単純な挨拶文を英語と日本語に対応させる。

Dojoでは、以下のルールに従って国際化対応リソースを配置することになる。

  • リソースは、読み込む対象パッケージ以下の「nls」と名付けたディレクトリ内から読み込まれる。上の例であれば、「mycom/nls」というディレクトリ内からリソースが読み込まれるということだ

  • nlsディレクトリ直下にはまず、ユーザのロケールにマッチしなかった際読み込まれる「デフォルトの」リソースを置く。この例では、「mycom/nls/helloMessage.js」というファイルを作成する。今回は、デフォルトのリソースは英語とした

  • さらに、nlsディレクトリ以下にはロケールの名称に合わせたサブディレクトリを作成し、各国語に対応したリソースファイルを作成する。この例では、英語に対応したリソースは「mycom/nls/en/helloMessage.js」として、日本語に対応したリソースは「mycom/nls/ja/helloMessage.js」として作成する

まとめると、以下のようなファイル構成になるということだ。

mycom/
   |- nls/
      |- helloMessage.js  … デフォルトロケール
      |- en/
      |- |- helloMessage.js … 英語リソース
      |- ja/
         |- helloMessage.js … 日本語リソース

そして、各ファイルの内容はJSONで記述する。内容は必ずUTF-8で保存すること!

英語 (デフォルト) のリソース

 {
   "hello": "Hello!"
 }

日本語のリソース

 {
  "hello": "こんにちは!",
 }

このように、Javaのリソースバンドルと似た仕組みだとは言え、細かいルールはずいぶんと異なる。もう一つ異なる点を挙げておくと、Javaではロケール表記の「言語」と「国」の間の区切り文字が「_」であった (例:en_US, de_DE) のに対し、Dojoでは区切り文字は「-」、国コードを小文字で表記する (例:en-us, de-de) といった違いがある。

リソースを使用する

以下のサンプルは、ページが読み込まれた直後に国際化されたメッセージをアラート表示するという非常に単純なサンプルだ。

リスト:国際化フレームワークのサンプル

<html>
<head>
<title>国際化のテスト</title>
<!-- (1) djConfig.localeに注目! -->
<script src="../js/dojo/dojo.js.uncompressed.js" djConfig="isDebug:true, locale: 'en'"></script>
<script type="text/javascript">
  // (2) 国際化されたリソースを読み込む
  dojo.requireLocalization("mycom", "helloMessage");
  // ページの読み込みが完了した際呼び出される関数 (init) を登録
  dojo.addOnLoad(init);

  // (3) リソースのコピーを取得
  var bundle = dojo.i18n.getLocalization("mycom", "helloMessage");
  function init() {
    alert(bundle.hello);
  }
</script>
</head>
<body></body>
</html>

(1) ロケールをDojoに伝えるためには、djConfig.localeプロパティを使用する。このプロパティを変更すれば、それに合わせて自動的に読み込まれるリソースが変化する。

(2) 先も言ったとおり、リソースの読み込みは「requireLocalization()」を使用する。

(3) そして、国際化されたメッセージを取得するのは「dojo.i18n.getLocalization()」メソッドだ。メソッドの定義は以下を見てほしい。このメソッドを呼び出すと、読み込まれたリソースのコピーが作成されて返される。

getLocalization(packageName, bundleName, locale)

  • packageName : リソースバンドルのパッケージ名
  • bundleName : リソースバンドルの名称
  • locale : ロケールを明示的に指定して読み込むこともできるが、通常この引数は省略する

コードが理解出来たら、djConfig.localeの値を変更し、ページを再読み込みしてみてほしい。djConfig.localeが"en"なら英語リソースが、"ja"なら日本語リソースが、それ以外ならデフォルトのリソースが読み込まれる。

また、Dojoのドキュメントによれば、djConfig.localeの値はサーバサイドで埋め込むのが良い、とされている。例えばサーバサイドをJSPで記述したとしたら以下のような形になる。

<!-- (1) djConfig.localeに注目! -->
<%
  // ロケールをDojoの形式に変換して埋め込み
  Locale loc = request.getLocale();
  if (loc == null) Locale.ENGLISH;

  String locale = loc.toString();
  locale = locale.toLowerCase().replace("\\_", "\\-");
%>
<script src="../js/dojo/dojo.js" djConfig="isDebug:true, locale: '<%= locale %>'"></script>