Überschreibungen der Internationalisierung (i18n) konfigurieren

Verwenden Sie Internationalisierungsumschreibungen („i18n-Umschreibungen“), um je nach Land oder bevorzugter Sprache des Nutzers unterschiedliche Inhalte zu präsentieren. Hier sind einige Beispielkonfigurationen, die Sie einrichten können:

  • Dieselben französischen Inhalte für alle Nutzer bereitstellen, die Französisch bevorzugen (unabhängig vom Land)
    Beispiel: eine Startseite mit französischem Text

  • Bieten Sie Nutzern, die Französisch bevorzugen, Inhalte in Standardfranzösisch an. Kanada-Nutzern, die Französisch bevorzugen, sollten Sie stattdessen Inhalte in kanadischem Französisch präsentieren.
    Beispiel: eine Startseite mit Standardfranzösisch und eine Startseite mit kanadisch-französischen Formulierungen

  • Dieselben Inhalte für alle kanadischen Nutzer ausliefern (unabhängig von ihrer Spracheinstellung).
    Beispiel: eine Startseite in der „Standardsprache“ Ihrer Website, aber mit einer kanadaspezifischen Funktion (z. B. ein Feiertagsthema)

  • Kanadiern, die Französisch bevorzugen, Inhalte auf Französisch (Kanada) präsentieren
    Beispiel: eine Startseite mit kanadischem Französisch und einer kanadischen Funktion (z. B. ein Feiertagsthema)

Firebase Hosting ermittelt das Land eines Nutzers anhand seiner IP-Adresse und die Spracheinstellungen eines Nutzers anhand des Accept-Language-Anfrageheaders (normalerweise automatisch vom Webbrowser festgelegt).

i18n-Umschreibungen einrichten

Wenn Sie i18n-Weiterleitungen für Ihre Hosting-Website einrichten möchten, müssen Sie ein Verzeichnis „i18n-Inhalte“ für alle lokalisierten Inhalte erstellen und dann der firebase.json-Datei das Attribut i18n hinzufügen, damit es auf das neue Verzeichnis „i18n-Inhalte“ verweist.

So gehts:

  1. Erstellen Sie im Ordner public Ihres lokalen App-Verzeichnisses ein separates Verzeichnis für Ihre „i18n-Inhalte“ und dann Unterordner für jede Kombination aus Sprache und Land, die von Ihrer Website unterstützt wird.

    Fügen Sie in jedem Unterordner die für diese Kombination spezifischen Inhalte hinzu, z. B. Startseiten mit saisonalem Design oder sprachspezifische 404-Seiten.

    Hier ist ein Beispiel für ein Verzeichnis mit i18n-Inhalten namens 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

    public/
        // 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.html

    Das Verzeichnis localized-files/ enthält separate Unterordner für jede Kombination aus Sprache und Land, die von Ihrer Website unterstützt wird. Das Benennungsmuster für jeden Unterordner muss einem der folgenden Formate entsprechen:

    • languageCode_countryCode: Enthält Inhalte, die speziell für Nutzer mit dieser Spracheinstellung und diesem Ländercode bestimmt sind.

    • languageCode: Enthält Inhalte, die speziell für Nutzer mit dieser Spracheinstellung gedacht sind, aber nicht länderspezifisch sind. Entspricht im Grunde languageCode_ALL.

    Weitere Informationen zu diesen Codes finden Sie unten im Abschnitt Länder- und Sprachcodes. Sie können den Wert ALL (mit Berücksichtigung der Groß- und Kleinschreibung) verwenden, um ein beliebiges Land (z. B. es_ALL/) oder eine beliebige Sprache (z. B. ALL_ca/) anzugeben.

    Die Dateien in einem Unterordner müssen nicht mit Dateien im Verzeichnis public oder in anderen Unterordnern identisch sein. Sie können Inhalte erstellen, die sich ausschließlich auf eine Sprache und/oder ein Land beziehen.

  2. Fügen Sie der firebase.json-Datei das Attribut i18n hinzu und geben Sie das Verzeichnis an, das Ihre „i18n-Inhalte“ enthält. Fortsetzung des Beispiels:

    // firebase.json
    
    "hosting": {
    
      "public": "public",
    
      "ignore": [
        "firebase.json",
        "**/.*",
        "**/node_modules/**"
      ],
    
      "i18n": {
        "root": "/localized-files"  // directory that contains your "i18n content"
      }
    
      ...
    }

    Das für root angegebene Verzeichnis muss der Name des Verzeichnisses sein, das alle Unterordner „i18n-Inhalte“ enthält. Wenn Sie alle Unterordner „i18n-Inhalte“ im Stammverzeichnis Ihres public-Verzeichnisses abgelegt haben, verwenden Sie / als Wert für root. Vorangestellte und nachgestellte Schrägstriche im Wert für root sind optional.

  3. Stellen Sie Ihre „i18n-Inhalte“ und die Konfiguration auf Ihrer Hosting-Website bereit.

Sie können die Einrichtung mit Cookie-Überschreibungen testen.

Länder- und Sprachcodes

Achten Sie beim Benennen von Unterordnern unter „i18n-Inhalte“ darauf, sowohl Länder- als auch Sprachcodes in Kleinbuchstaben zu schreiben. Sie können den Wert ALL (Groß- und Kleinschreibung beachten) verwenden, um ein beliebiges Land (z. B. es_ALL/) oder eine beliebige Sprache (z. B. ALL_ca/) anzugeben.

Hosting ruft den Ländercode anhand der IP-Adresse des Nutzers ab. Ländercodes sind zweistellige ISO 3166-1 alpha-2-Codes.

Die Sprachcodes werden aus dem Accept-Language-Anfrageheader des Nutzers abgerufen, der normalerweise automatisch vom Webbrowser festgelegt wird. Es handelt sich dabei um ISO 639-1-Codes. Beachten Sie bei der Verwendung von Sprachcodes Folgendes:

  • Wenn Hosting nach den „i18n-Inhalten“ sucht, die ausgeliefert werden sollen, werden die Sprachen anhand der Qualitätswerte im Accept-Language-Header sortiert.

  • Hosting entfernt alle regionalen und länderspezifischen Unter-Tags im Accept-Language-Header. Daher dürfen diese Unter-Tags nicht im Sprachcode eines Unterordners mit dem Namen „i18n-Inhalte“ enthalten sein. Sie können beispielsweise es-419 oder es-US nicht als Sprachcode in einem Unterordnernamen verwenden, aber es.

    Wenn Sie bestimmte regionale oder länderspezifische Inhalte bereitstellen möchten, können Sie Unterordner erstellen, die die Inhalte für die jeweilige Sprache und das jeweilige Land enthalten, die Sie unterstützen möchten.

    In diesem Beispiel würde eine Anfrage aus Spanien mit der Spracheinstellung es, es-es oder sogar es-419 Inhalte aus dem Unterordner es_es/ erhalten, da Hosting alle diese Sprachcodes als es behandelt.

    Bei einer Anfrage aus den USA, Mexiko oder einem anderen Land mit der Spracheinstellung es-419 werden Inhalte aus dem Unterordner es_ALL/ zurückgegeben, da Hosting es-419 als es behandelt.

    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

    In diesem Beispiel würde eine Anfrage aus Mexiko mit der Spracheinstellung es-419 Inhalte aus dem Unterordner es_mx/ erhalten, da Hosting den Sprachcode es-419 als es behandelt.

    Bei einer Anfrage aus den USA mit der Spracheinstellung es-419 werden jedoch Inhalte aus dem Unterordner es_ALL/ zurückgegeben, da Hosting es-419 als es behandelt und es keinen Unterordner es_us/ gibt.

    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

Prioritätsreihenfolge für „i18n-Inhalte“

Wenn Sie i18n-Umschreibungen einrichten, werden Inhalte in Hosting in der folgenden Prioritätsreihenfolge ausgeliefert:

  1. Reservierte Namespaces, die mit einem Pfadsegment /__/* beginnen

  2. Konfigurierte Weiterleitungen

  3. Statische Inhalte mit exakter Übereinstimmung

    1. Sprachcode + Ländercode (z. B. Inhalte aus fr_ca/)
      Die Reihenfolge entspricht den Qualitätswerten für jede Sprache im Accept-Language-Header der Anfrage.

    2. Nur Ländercode (z. B. Inhalte aus ALL_ca/)

    3. Nur Sprachcode (z. B. Inhalte von fr/ oder es_ALL/)
      Die Reihenfolge folgt den Qualitätswerten für jede Sprache im Accept-Language-Header der Anfrage.

    4. „Standard“-statische Inhalte mit exakter Übereinstimmung
      Das sind Inhalte, die sich außerhalb des Verzeichnisses „i18n content“ befinden, z. B. im Stammverzeichnis des public-Verzeichnisses.

  4. Konfigurierte Umschreibungen

  5. 404-Verarbeitung

    1. i18n-404-Seiten
      Die Reihenfolge der Prioritäten entspricht der oben für statische Inhalte mit exakter Übereinstimmung aufgeführten.

    2. Benutzerdefinierte 404-Seite

    3. Standard-404-Seite (von Firebase bereitgestellt)

Beispiel für die Prioritätsreihenfolge

Fahren wir mit unserem Beispiel oben fort. Wir verwenden dasselbe Beispielverzeichnis und eine Beispielanfrage.

  • Beispiel für ein lokales Projektverzeichnis mit einem Verzeichnis „i18n-Inhalte“ (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
  • Beispiel für Anfrageinformationen

    • Sprachcodes: fr, en (französisch, dann englisch)
      Die Sprachcodes werden anhand der Qualitätswerte im Accept-Language-Header sortiert.

    • Ländercode: ca (Kanada)

Gemäß der Prioritätsreihenfolge für die genaue Übereinstimmung und den Qualitätswerten für die Spracheinstellungen sucht Hosting in den Verzeichnissen in der folgenden Reihenfolge nach einer angeforderten Seite.

  1. public/localized-files/fr_ca/

  2. public/localized-files/en_ca/

  3. public/localized-files/ALL_ca/

  4. public/localized-files/fr_ALL/

  5. public/localized-files/fr/

  6. public/localized-files/en_ALL/

  7. public/localized-files/en/

  8. public/

  9. 404-Verarbeitung

Welche Seite wird dem Nutzer präsentiert?

  • Angeforderte Seite: index.html

    index.html aus dem Unterordner fr_ca/

    Da Hosting zuerst im Unterordner fr_ca/ sucht, wird dort die genaue Übereinstimmung für index.html gefunden.

  • Angeforderte Seite: awesome-page.html

    404.html aus dem Unterordner fr/

    Hosting sucht zuerst in der Prioritätsreihenfolge im gesamten Verzeichnis (einschließlich aller Unterordner „i18n-Inhalte“ und des Stammverzeichnisses) nach einer genauen Übereinstimmung. Für awesome-page.html wird jedoch keine genaue Übereinstimmung gefunden.

    Daher startet Hosting die 404-Behandlung, die derselben i18n-Prioritätsreihenfolge wie bei Suchanfragen mit der Option „Genau passend“ folgt. Der Unterordner fr/ ist der erste Unterordner, in dem nach einer 404-Seite gesucht wird.

Beachten Sie bei der Suche und Bereitstellung im Verzeichnis „i18n content“ Folgendes:

  • Das Verzeichnis localized-files/ enthält keine Unterordner en_ca/, en_ALL/ oder en/. Daher geht Hosting einfach die Prioritätsliste durch, bis ein passender Unterordner für die Sprach-/Landeskombination der Anfrage gefunden wird.

  • Auch wenn das Verzeichnis localized-files/ einen Unterordner es_ALL/ enthält, enthält die Beispiel-Anfrage oben keinen es- oder es-foo-Sprachcode. Daher wird in Hosting nicht nach „i18n-Inhalten“ gesucht, die mit es übereinstimmen.

  • Unterordner mit den Namen fr/ und fr_ALL/ sind aus Sicht der Länder- und Spracheinstellungen eines Nutzers gleichwertig. Wenn jedoch beide Unterordner vorhanden sind, werden bei Hosting fr_ALL/-Inhalte vor fr/-Inhalten ausgeliefert.

Du kannst festlegen, welche Inhalte ausgeliefert werden, indem du die Länder- und Sprach-Header über Cookies überschreibst.

Hier sind einige Möglichkeiten, wie Sie Cookie-Überschreibungen verwenden können:

  • Testen Sie eine Funktion mit verschiedenen Sprach-/Landeskombinationen, um zu prüfen, welche Inhalte ausgeliefert werden.

  • Bieten Sie Ihren Nutzern die Möglichkeit, die angezeigten Inhalte zu ändern. Sie können beispielsweise eine Sprachauswahl implementieren und dann das firebase-language-override-Cookie des Nutzers entsprechend festlegen.

Wenn Sie Cookie-Überschreibungen konfigurieren möchten, legen Sie Cookies mit einem oder beiden dieser Namen fest: firebase-country-override und firebase-language-override. Im folgenden JavaScript-Code-Snippet wird beispielsweise der Ländercode auf ca und der Accept-Language-Header auf fr,en überschrieben:

document.cookie = "firebase-country-override=ca";
document.cookie = "firebase-language-override=fr,en";

Sprach-Cookie-Überschreibungen müssen eine kommagetrennte Liste von Sprachcodes in der Reihenfolge der Präferenz sein, ohne Untertags oder Qualitätswerte.

Cookie-Überschreibungen werden in den Protokollen nicht berücksichtigt.