getMessages
getMessages() 文字列翻訳関数のAPIリファレンス
概要
getMessages 関数は、ビルド時に msg からの encoded string を翻訳する非同期関数です。
const m = await getMessages();
<p>{ m(encodedString) }</p>;Buildtime Translation:
getMessages の翻訳は、アプリをデプロイする前のビルド時に実行されます。
msg からエンコード済み文字列を渡すと、ユーザーの優先言語に翻訳されます。
リファレンス
パラメータ
なし
戻り値
msg から渡されたエンコード済みコンテンツを翻訳するコールバック関数 m を返す Promise。
Promise<(encodedContent: string, options?: Record<string, any>) => string>| Name | Type | Description |
|---|---|---|
encodedContent | string | 翻訳対象となる、msg から取得したエンコード済み文字列。 |
options? | Record<string, any> | エンコード済み文字列に変数を渡すためのオプションパラメーター。 |
動作
本番環境
CDプロセス（継続的デリバリー／継続的デプロイ）の間、msg 関数内のコンテンツは、アプリケーションのデプロイ前に翻訳されます。
これにより、すべての対応ロケールで高速な読み込みが実現しますが、ビルド時点で既知のコンテンツのみが翻訳対象となります。
生成された翻訳は、設定に応じて (1) CDN（コンテンツ配信ネットワーク）に保存するか、(2) アプリのビルド出力に含められます。 その後、翻訳済みコンテンツがユーザーに配信されます。 翻訳が見つからない場合は、元のコンテンツがフォールバックとして使用されます。
こちらのデプロイガイドに従ってください。
開発
開発中は、m 関数が必要に応じてコンテンツを翻訳します。
これは、アプリが各言語でどのように見えるかをプロトタイピングするのに役立ちます。
この挙動を有効にするには、環境に Dev APIキー を追加することを忘れないでください。
開発時のオンデマンド翻訳では遅延が発生します。
これは、本番ビルドでは、コンテンツを明示的にオンデマンドで翻訳している場合――
つまり、tx または <Tx> を使用している場合――を除き、発生しません。
例
基本的な使い方
getMessages を使用すると、msg に含まれるエンコード済み文字列を翻訳できます。
import { msg, getMessages } from 'gt-next/server';
const encodedGreeting = msg('こんにちは、Alice!');
export default async function TranslateGreeting() {
const m = await getMessages();
return (
<p>
{m(encodedGreeting)}
</p>
);
}注意：「Alice」はユーザーの優先言語に翻訳されます。
変数の使用
エンコードされた文字列に変数を渡すことができます。
import { msg, getMessages } from 'gt-next/server';
const encodedGreeting = msg('こんにちは、{name}さん！');
export default async function TranslateGreeting() {
const m = await getMessages();
return (
<p>
{m(encodedGreeting, { name: 'Bob' })} {/* 「こんにちは、Bobさん！」と表示されます */}
</p>
);
}msg 変数は m 変数より優先される
msg と m の両方に変数を渡した場合は、msg に渡された変数が m に渡された変数よりも優先されます。
import { msg, getMessages } from 'gt-next/server';
const encodedGreeting = msg('Hello, {name}!', { name: 'Alice' });
export default async function TranslateGreeting() {
const m = await getMessages();
return (
<p>
{m(encodedGreeting, { name: 'Bob' })}
</p>
);
}注: これは「Hello, Alice!」と表示されます。レンダリング時に変数は上書きされません。
ICU メッセージ形式の使用
gt-next は ICU メッセージ形式をサポートしており、variables のフォーマットにも対応しています。
import { msg, getMessages } from 'gt-next/server';
const encodedMessage = msg('カートに{count, plural, =0 {商品はありません} =1 {商品が1点あります} other {商品が{count}点あります}}', { count: 10 });
export default async function TranslateGreeting() {
const m = await getMessages();
return (
<p>
{m(encodedMessage)}
</p>
);
}ICU message format は、variables をフォーマットする強力な方法です。 詳細は、ICU message format のドキュメントをご覧ください。
注意事項
getMessages関数は、msgのエンコード済み文字列を翻訳するサーバーサイド関数です。getMessagesによる翻訳は、実行時ではなくビルド時（開発環境を除く）に行われます。
次のステップ
- ビルド時にエンコード済み文字列からクライアントサイドの文字列を翻訳するには、
useMessagesを参照してください。 - 翻訳用に文字列をエンコードするには、
msgを参照してください。 - 実行時の翻訳については、
txと<Tx>を参照してください。
このガイドはいかがですか?