getMessages()

概要

getMessages() 関数は、ビルド時に msg() から渡されたエンコード済み文字列を翻訳するための非同期関数です。

const m = await getMessages();

<p>{  m(encodedString)  }</p>;

ビルド時の翻訳: 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) アプリのビルド出力に保存されます。そこから翻訳済みコンテンツがユーザーに配信されます。翻訳が見つからない場合は、元のコンテンツにフォールバックします。

こちらのデプロイガイドに従ってください。

import { msg, getMessages } from 'gt-next/server';

const encodedGreeting = msg('Hello, 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('Hello, {name}!', { name: 'Alice' });

export default async function TranslateGreeting() {
  const m = await getMessages();

  return (
    <p>
      {m(encodedGreeting, { name: 'Bob' })}
    </p>
  );
}

注: 表示は "Hello, Bob!" になります。変数はレンダー時に上書きされます。

ICU メッセージ形式の使用

gt-next は ICU メッセージ形式をサポートしており、変数の書式設定も可能です。

import { msg, getMessages } from 'gt-next/server';

const encodedMessage = msg('There are {count, plural, =0 {no items} =1 {one item} other {{count} items}} in the cart', { count: 10 });

export default async function TranslateGreeting() {
  const m = await getMessages();
  return (
    <p>
      {m(encodedMessage)}
    </p>
  );
}

ICU メッセージ形式は、変数に書式を適用する強力な方法です。くわしくは、ICU メッセージ形式のドキュメントをご覧ください。

注記

getMessages() 関数は、msg() から渡されるエンコード済みの文字列を翻訳するサーバーサイド関数です。
getMessages() による翻訳は、実行時ではなくビルド時に実行されます（開発時を除く）。

次のステップ

ビルド時にエンコードした文字列をクライアント側で翻訳するには、useMessages() を参照してください。
翻訳用に文字列をエンコードするには、msg() を参照してください。
実行時の翻訳については、tx() と <Tx> を参照してください。
翻訳のカスタマイズの詳細は、InlineTranslationOptions を参照してください。