国際化の書き換え (「i18n 書き換え」) を使用して、ユーザーの国または優先言語に応じて異なるコンテンツを提供します。設定できる構成の例を次に示します。
フランス語を好むすべてのユーザーに同じフランス語のコンテンツを提供します (国に関係なく)。
例: フランス語のテキストを含むホームページフランス語を好むユーザーには標準フランス語のコンテンツを提供しますが、フランス語を好むカナダのユーザーには代わりにカナダのフランス語コンテンツを提供します。
例: 標準フランス語の言い回しのホームページとカナダフランス語の言い回しのホームページカナダのすべてのユーザーに同じコンテンツを提供します (言語設定に関係なく)。
例: サイトの「デフォルト」言語を使用しているが、カナダ固有の機能 (ホリデー テーマなど) を備えたホームページフランス語を好むカナダのユーザーにカナダのフランス語のコンテンツを提供します。
例: カナダのフランス語の言い回しとカナダ固有の機能 (休日のテーマなど) を含むホームページ
Firebase Hosting は、IP アドレスからユーザーの国を判断し、 Accept-Languageリクエスト ヘッダーからユーザーの言語設定を判断します (通常はウェブ ブラウザによって自動的に設定されます)。
i18n 書き換えをセットアップする
ホスティング サイトの i18n リライトを設定するには、ローカライズされたすべてのコンテンツ用に「i18n コンテンツ」ディレクトリを作成し、 i18n属性をfirebase.jsonファイルに追加して、新しい「i18n コンテンツ」ディレクトリを指すようにする必要があります。
詳細な手順は次のとおりです。
ローカル アプリ ディレクトリの
publicフォルダー内に、「i18n コンテンツ」用に別のディレクトリを作成し、サイトでサポートされている言語と国の組み合わせごとにサブフォルダーを作成します。各サブフォルダーに、休日をテーマにしたホームページや言語固有の 404 ページなど、その組み合わせに固有のコンテンツを追加します。
localized-filesと呼ばれる「i18n コンテンツ」ディレクトリの例を次に示します。public/ index.html // your site's default homepage 404.html // your site's custom 404 page localized-files/ ALL_ca/ index.html es_ALL/ index.html 404.html fr/ index.html 404.html fr_ca/ index.htmlpublic/ // matches requests that aren't specified by your "i18n content" subfolders // example: display your homepage in the "default" language for your site with no country-specific features index.html // your site's default homepage 404.html // your site's custom 404 page localized-files/ // matches requests from Canada with any language preference // example: display your homepage in the "default" language for your site with a Canada-specific feature ALL_ca/ index.html // matches requests from any country with a language preference of `es` or `es-foo` // example: display your homepage in Spanish with no country-specific features es_ALL/ index.html 404.html // your site's custom 404 page in Spanish // matches requests from any country with a language preference of `fr` or `fr-foo` // example: display your homepage in Standard French with no country-specific features fr/ index.html 404.html // your site's custom 404 page in French // matches requests from Canada with a language preference of `fr` or `fr-foo` // example: display your homepage in Canadian French and/or with a Canada-specific feature fr_ca/ index.htmllocalized-files/ディレクトリには、サイトでサポートされている言語と国の組み合わせごとに個別のサブフォルダーが含まれています。各サブフォルダーの命名パターンは、次のいずれかの形式に従う必要があります。languageCode_countryCode: その言語設定とその国コードを持つユーザーに固有のコンテンツが含まれていますlanguageCode: その言語設定を持つユーザーに固有のコンテンツが含まれていますが、コンテンツは国固有ではありません。基本的にlanguageCode_ALLと同等
これらのコードの詳細については、以下のサブセクションの国と言語のコードを参照してください。
ALLの値 (大文字と小文字を区別) を使用して、任意の国 (es_ALL/など) または任意の言語 (ALL_ca// など) を示すことができます。サブフォルダー内のファイルは、
publicディレクトリまたは他のサブフォルダー内に類似のファイルを持つ必要はありません。特定の言語や国に完全に特化したコンテンツを作成できます。i18n属性をfirebase.jsonファイルに追加し、「i18n コンテンツ」を含むディレクトリを指定します。例を続けます。// firebase.json "hosting": { "public": "public", "ignore": [ "firebase.json", "**/.*", "**/node_modules/**" ], "i18n": { "root": "/localized-files" // directory that contains your "i18n content" } ... }rootに指定するディレクトリは、すべての「i18n コンテンツ」サブフォルダを含むディレクトリの名前である必要があります。すべての「i18n コンテンツ」サブフォルダーをpublicディレクトリのルートに配置した場合は、rootの値に/を使用します。root値の先頭と末尾のスラッシュはオプションです。「i18n コンテンツ」と構成をホスティング サイトにデプロイします。
Cookie オーバーライドを使用して設定をテストできます。
国コードと言語コード
「i18n コンテンツ」サブフォルダーに名前を付けるときは、国コードと言語コードの両方に小文字を使用する必要があります。 ALLの値 (大文字と小文字を区別) を使用して、任意の国 ( es_ALL/など) または任意の言語 ( ALL_ca/ / など) を示すことができます。
ホスティングは、ユーザーの IP アドレスから国コードを取得します。国コードは、2 文字のISO 3166-1 alpha-2 コードです。
言語コードは、ユーザーのAccept-Languageリクエスト ヘッダーから取得されます (通常、ウェブ ブラウザによって自動的に設定されます)。それらはISO 639-1 コードです。言語コードを使用する場合は、次の点に注意してください。
Hosting が提供する「i18n コンテンツ」を検索するとき、
Accept-Languageヘッダーの品質値に基づいて言語を並べ替えます。ホスティングは、
Accept-Languageヘッダーの地域および国のサブタグを削除するため、「i18n コンテンツ」サブフォルダー名の言語コードにこれらのサブタグを含めることはできません。たとえば、サブフォルダー名の言語コードとして eses-419またはes-USを使用することはできませんが、esを使用することはできます。特定の地域または国のコンテンツを提供する場合は、サポートする特定の言語と国のコンテンツを含むサブフォルダーを作成できます。
この例では、言語設定が
es、es-es、またはes-419であるスペインからのリクエストは、Hosting がこれらすべての言語コードをesとして扱うため、es_es/サブフォルダーからコンテンツを受け取ります。Hosting は
es-419をesとして扱うため、言語設定がes-419である米国、メキシコ、またはその他の国からのリクエストは、es_ALL/サブフォルダーからコンテンツを受け取ります。public/ // matches requests that aren't specified by your "i18n content" subfolders index.html // the site's default homepage localized-files/ // matches requests from Spain with a language preference of `es` or `es-foo` es_es/ index.html // matches requests from any other country with a language preference of `es` or `es-foo` es_ALL/ index.htmlこの例では、Hosting が言語コード
es-419をesとして扱うため、言語設定がes-419のメキシコからのリクエストはes_mx/サブフォルダーからコンテンツを受け取ります。ただし、ホストが
es-419をesとして扱い、es_us/ サブフォルダーがないため、言語設定がes-419の米国からの要求は、es_ALL/es_us/フォルダーからコンテンツを受け取ります。public/ // matches requests that aren't specified by your "i18n content" subfolders index.html // the site's default homepage localized-files/ // matches requests from Argentina with a language preference of `es` or `es-foo` (mimics behavior of `es-ar` header tag) es_ar/ index.html // matches requests from Spain with a language preference of `es` or `es-foo` (mimics behavior of `es-es` header tag) es_es/ index.html // matches requests from Mexico with a language preference of `es` or `es-foo` (mimics behavior of `es-mx` header tag) es_mx/ index.html // matches requests from any other country with a language preference of `es` or `es-foo` (mimics behavior of `es-419` header tag) es_ALL/ index.html
「i18nコンテンツ」の優先順位
i18n リライトを設定すると、Hosting は次の優先順位に基づいてコンテンツを提供します。
/__/*パス セグメントで始まる予約済みの名前空間完全一致の静的コンテンツ
言語コード + 国コード (たとえば、
fr_ca/のコンテンツ)
順序は、リクエストのAccept-Languageヘッダー内の各言語の品質値に従います。国コードのみ (たとえば、
ALL_ca/のコンテンツ)言語コードのみ (たとえば、
fr/またはes_ALL/のコンテンツ)
順序は、リクエストのAccept-Languageヘッダー内の各言語の品質値に従います。「デフォルト」完全一致静的コンテンツ
これは、publicディレクトリのルートなど、「i18n コンテンツ」ディレクトリの外にあるコンテンツです。
構成された書き換え
404ハンドリング
i18n 404 ページ
これは、上記の完全一致静的コンテンツの優先順位と同じ優先順位に従います。カスタム 404ページ
デフォルトの 404 ページ (Firebase が提供)
優先順位の例
上記の例を続けましょう。同じサンプル ディレクトリとサンプル リクエストを使用します。
「i18n コンテンツ」ディレクトリ (
localized-filesと呼ばれる) を含むローカル プロジェクト ディレクトリの例public/ index.html // your site's default homepage 404.html // your site's custom 404 page localized-files/ ALL_ca/ index.html es_ALL/ index.html 404.html fr/ index.html 404.html fr_ca/ index.htmlリクエスト情報の例
言語コード:
fr、en(フランス語、次に英語)
言語コードは、Accept-Languageヘッダーの品質値に基づいて並べられます。国コード:
ca(カナダ)
完全一致の優先順位と言語設定の品質値に従って、Hosting は要求されたページのディレクトリを次の順序で検索します。
public/localized-files/fr_ca/public/localized-files/en_ca/public/localized-files/ALL_ca/public/localized-files/fr_ALL/public/localized-files/fr/public/localized-files/en_ALL/public/localized-files/en/public/404ハンドリング
ユーザーに提供されるページはどれですか?
リクエストされたページ:
index.htmlfr_ca/サブフォルダーのindex.htmlHosting は最初に
fr_ca/サブフォルダーを検索するため、そのサブフォルダーでindex.htmlに完全に一致するものを見つけます。要求されたページ:
awesome-page.htmlfr/サブフォルダーの404.htmlホスティングは最初にディレクトリ全体 (すべての「i18n コンテンツ」サブフォルダーとルート ディレクトリを含む) を優先順に検索して完全一致を探しますが、
awesome-page.htmlの完全一致はありません。そのため、ホスティングは 404 処理を開始します。これは、完全一致検索と同じ i18n 優先順位に従います。
fr/サブフォルダーは、404 ページを含む最初に検索されたサブフォルダーです。
この「i18n コンテンツ」ディレクトリの検索と提供については、次の点に注意してください。
localized-files/ディレクトリには、実際にはen_ca/、en_ALL/、またはen/サブフォルダーが含まれていないため、Hosting は、リクエストの言語と国の組み合わせに一致するサブフォルダーが見つかるまで、優先順位リストをスキップします。localized-files/ディレクトリにはes_ALL/サブフォルダーが含まれていますが、上記のリクエスト例にはesまたはes-foo言語コードが含まれていないため、Hosting はesに一致する「i18n コンテンツ」を検索しません。fr/およびfr_ALL/という名前のサブフォルダーは、ユーザーの国および言語設定の観点からは同等です。ただし、両方のサブフォルダーが存在する場合、ホスティングはfr/コンテンツの前にfr_ALL/コンテンツを提供します。
言語コードと国コードを Cookie で上書きする
Cookie を使用して国と言語のヘッダーを上書きすることで、提供されるコンテンツを変更できます。
以下に、Cookie のオーバーライドを使用できるいくつかの方法を示します。
さまざまな言語/国の組み合わせで機能をテストして、提供されるコンテンツを確認します。
ユーザーが表示されるコンテンツを変更できるようにします。たとえば、言語ピッカーを実装し、それに応じてユーザーの
firebase-language-overrideCookie を設定できます。
Cookie オーバーライドを構成するには、次の名前の両方またはいずれかで Cookie を設定します: firebase-country-overrideおよびfirebase-language-override 。たとえば、次の JavaScript コード スニペットは、国コードをcaにオーバーライドし、 Accept-Languageヘッダーをfr,enにオーバーライドします。
document.cookie = "firebase-country-override=ca";
document.cookie = "firebase-language-override=fr,en";
言語 Cookie のオーバーライドは、サブタグや品質値を含まない、言語コードのコンマ区切りリストである必要があります。
Cookie のオーバーライドはログに反映されません。