If you are building server-rendered Angular or Next.js apps, check out next-generation Firebase App Hosting, a full-stack solution for modern web frameworks.

Google utilise la technologie IA pour traduire le contenu dans votre langue préférée. Les traductions générées par IA peuvent contenir des erreurs.

Configurer les réécritures d'internationalisation (i18n)

Utilisez les réécritures d'internationalisation ("réécritures i18n") pour diffuser différents contenus en fonction du pays ou de la langue préférée d'un utilisateur. Voici quelques exemples de configurations que vous pouvez définir :

Diffuser le même contenu en français à tous les utilisateurs qui préfèrent le français (quel que soit le pays)
Exemple : une page d'accueil avec du texte en français
Diffuser du contenu en français standard aux utilisateurs qui préfèrent le français, mais diffuser du contenu en français canadien aux utilisateurs canadiens qui préfèrent le français
Exemple : une page d'accueil avec une formulation en français standard par rapport à une page d'accueil avec une formulation en français canadien
Diffuser le même contenu à tous les utilisateurs canadiens (quelle que soit leur préférence linguistique)
Exemple : une page d'accueil dans la langue "par défaut" de votre site, mais avec une fonctionnalité spécifique au Canada (comme un thème de vacances)
Diffuser du contenu en français canadien aux utilisateurs canadiens qui préfèrent le français
Exemple : une page d'accueil avec une formulation en français canadien et une fonctionnalité spécifique au Canada (comme un thème de vacances)

Firebase Hosting détermine le pays d'un utilisateur à partir de son adresse IP et ses préférences linguistiques à partir de l'en-tête de requête Accept-Language (généralement défini automatiquement par son navigateur Web).

Configurer les réécritures i18n

Pour configurer les réécritures i18n pour votre site Hosting, vous devez créer un répertoire "i18n content" pour tous vos contenus localisés, puis ajouter l'attribut i18n à votre fichier firebase.json pour pointer vers votre nouveau répertoire "i18n content".

Voici les étapes détaillées :

Dans le dossier public du répertoire de votre application locale, créez un répertoire distinct pour votre "i18n content", puis créez des sous-dossiers pour chaque combinaison de langue et de pays acceptée par votre site.

Dans chaque sous-dossier, ajoutez le contenu spécifique à cette combinaison, comme des pages d'accueil sur le thème des fêtes ou des pages 404 spécifiques à une langue.

Voici un exemple de répertoire "i18n content" appelé 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

Afficher les requêtes correspondantes pour le contenu de chaque sous-dossier

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

Le répertoire localized-files/ contient des sous-dossiers distincts pour chaque combinaison de langue et de pays acceptée par votre site. Le schéma de nommage de chaque sous-dossier doit respecter l'un des formats suivants :

languageCode_countryCode : contient du contenu spécifique aux utilisateurs qui ont cette préférence linguistique et ce code pays
languageCode : contient du contenu spécifique aux utilisateurs qui ont cette préférence linguistique, mais le contenu n'est pas spécifique à un pays. Il est donc équivalent à languageCode_ALL.

Pour en savoir plus sur ces codes, consultez la sous-section Codes pays et de langue ci-dessous. Vous pouvez utiliser la valeur de ALL (sensible à la casse) pour indiquer n'importe quel pays (comme es_ALL/) ou n'importe quelle langue (comme ALL_ca/).

Les fichiers d'un sous-dossier n'ont pas besoin d'avoir des fichiers analogues dans le répertoire public ou d'autres sous-dossiers. Vous pouvez créer du contenu entièrement spécifique à une langue et/ou à un pays.

Ajoutez l'attribut i18n à votre fichier firebase.json et spécifiez le répertoire qui contient votre "i18n content". Reprenons notre exemple :
```
// firebase.json

"hosting": {

  "public": "public",

  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ],

  "i18n": {
    "root": "/localized-files"  // directory that contains your "i18n content"
  }

  ...
}
```
Le répertoire spécifié pour root doit être le nom du répertoire qui contient tous vos sous-dossiers "i18n content". Si vous avez placé tous vos "i18n content" sous-dossiers à la racine de votre répertoire public, utilisez / pour la valeur de root. Les barres obliques de début et de fin dans la valeur root sont facultatives.
Déployez votre "i18n content" et votre configuration sur votre site Hosting.

Vous pouvez tester votre configuration à l'aide de remplacements de cookies.

Codes pays et de langue

Lorsque vous nommez des sous-dossiers "i18n content", vous devez utiliser des minuscules pour les codes pays et de langue. Vous pouvez utiliser la valeur ALL (sensible à la casse) pour indiquer n'importe quel pays (comme es_ALL/) ou n'importe quelle langue (comme ALL_ca/).

Hosting obtient le code pays à partir de l'adresse IP de l'utilisateur. Les codes pays sont des codes ISO 3166-1 alpha-2 à deux lettres.

Les codes de langue sont obtenus à partir de l'en-tête de requête Accept-Language de l'utilisateur (généralement défini automatiquement par son navigateur Web). Il s'agit de codes ISO 639-1. Tenez compte des points suivants lorsque vous utilisez des codes de langue :

Lorsque Hosting recherche le "i18n content" à diffuser, il ordonne les langues en fonction des valeurs de qualité dans l'en-tête Accept-Language.

Hosting supprime tous les sous-tags régionaux et pays dans l'Accept-Language en-tête. Par conséquent, le code de langue dans le nom d'un sous-dossier "i18n content" ne peut pas contenir ces sous-tags. Par exemple, vous ne pouvez pas utiliser es-419 ou es-US comme code de langue dans un nom de sous-dossier, mais vous pouvez utiliser es.

Si vous souhaitez diffuser du contenu régional ou pays spécifique, vous pouvez créer des sous-dossiers contenant le contenu spécifique à la langue et au pays que vous souhaitez prendre en charge.

Afficher des exemples pour prendre en charge du contenu régional ou pays spécifique

Diffuser du contenu en espagnol applicable à l'Espagne plutôt qu'à n'importe quel autre pays (imiter le comportement de es-419)

Dans cet exemple, une requête provenant d'Espagne avec la préférence linguistique es, es-es ou même es-419 recevra du contenu du sous-dossier es_es/ car Hosting traite tous ces codes de langue comme es.

Une requête provenant des États-Unis, du Mexique ou de tout autre pays avec la préférence linguistique es-419 recevra du contenu du es_ALL/ sous-dossier, car Hosting traite es-419 comme es.

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

Diffuser du contenu en espagnol applicable à des pays spécifiques

Dans cet exemple, une requête provenant du Mexique avec la préférence linguistique de es-419 recevrait du contenu du sous-dossier es_mx/, car Hosting traite le code de langue es-419 comme es.

Toutefois, une requête provenant des États-Unis avec la préférence linguistique es-419 recevra du contenu du sous-dossier es_ALL/, car Hosting traite es-419 comme es et qu'il n'existe pas de sous-dossier 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

Ordre de priorité pour "i18n content"

Si vous configurez des réécritures i18n, Hosting diffuse le contenu en fonction de l'ordre de priorité suivant :

Espaces de noms réservés commençant par un segment de chemin d'accès /__/*
Redirections configurées
Contenu statique à correspondance exacte
1. Code de langue + Code pays (par exemple, contenu de fr_ca/)
  L'ordre suit les valeurs de qualité de chaque langue dans l'en-tête Accept-Language de la requête.
2. Code pays uniquement (par exemple, contenu de ALL_ca/)
3. Code de langue uniquement (par exemple, contenu de fr/ ou es_ALL/)
  L'ordre suit les valeurs de qualité de chaque langue dans l'en-tête Accept-Language de la requête.
4. Contenu statique à correspondance exacte "par défaut"
  Il s'agit de contenu qui se trouve en dehors du répertoire "i18n content", par exemple à la racine du répertoire public directory.
Réécritures configurées
Gestion des erreurs 404
1. Pages 404 i18n
  L'ordre de priorité est le même que celui indiqué ci-dessus pour le contenu statique à correspondance exacte.
2. Page 404 personnalisée
3. Page 404 par défaut (fournie par Firebase)

Exemple d'ordre de priorité

Reprenons l'exemple ci-dessus. Nous utiliserons le même répertoire d'exemple et une requête d'exemple.

Exemple de projet en local avec un répertoire "i18n content" (appelé 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

Exemple d'informations de requête
- Codes de langue : fr, en (français, puis anglais)
  Les codes de langue sont classés en fonction des valeurs de qualité dans l' Accept-Language en-tête.
- Code pays : ca (Canada)

Conformément à l'ordre de priorité de correspondance exacte et aux valeurs de qualité des préférences linguistiques, Hosting recherche une page demandée dans les répertoires dans l'ordre suivant.

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/
Gestion des erreurs 404

Quelle page sera diffusée à l'utilisateur ?

Page demandée : index.html

Réponse

index.html du sous-dossier fr_ca/

Étant donné que Hosting recherche d'abord le sous-dossier fr_ca/, il trouvera la correspondance exacte pour index.html dans ce sous-dossier.
Page demandée : awesome-page.html

Réponse

404.html du sous-dossier fr/

Hosting recherche d'abord la correspondance exacte dans l'ensemble du répertoire (y compris tous les sous-dossiers "i18n content" et le répertoire racine) par ordre de priorité, mais il n'existe pas de correspondance exacte pour awesome-page.html.

Hosting commence donc sa gestion des erreurs 404, qui suit le même ordre de priorité i18n que les recherches de correspondance exacte.Hosting Le sous-dossier fr/ est le premier sous-dossier recherché qui contient une page 404.

Tenez compte des remarques suivantes concernant cette recherche et cette diffusion du répertoire "i18n content" :

Le répertoire localized-files/ ne contient pas de sous-dossiers en_ca/, en_ALL/ ni en/. Hosting ignore donc la liste de priorité jusqu'à ce qu'il trouve un sous-dossier correspondant à la combinaison langue-pays de la requête.
Même si le répertoire localized-files/ contient un es_ALL/ sous-dossier, l'exemple de requête ci-dessus n'inclut pas de code de es ni es-foo langue. Hosting ne recherchera donc pas de "i18n content" correspondant à es.
Les sous-dossiers appelés fr/ et fr_ALL/ sont équivalents du point de vue des préférences linguistiques et pays d'un utilisateur. Toutefois, si les deux sous-dossiers existent, Hosting diffusera le contenu fr_ALL/ avant le contenu fr/.

Vous pouvez modifier le contenu diffusé à l'aide de cookies pour remplacer les en-têtes pays et langue.

Voici quelques façons d'utiliser les remplacements de cookies :

Testez une fonctionnalité avec différentes combinaisons de langue/pays pour vérifier le contenu diffusé.
Permettez à vos utilisateurs de modifier le contenu qu'ils voient. Par exemple, vous pouvez implémenter un outil de sélection de langue, puis définir le cookie firebase-language-override de l'utilisateur en conséquence.

Pour configurer les remplacements de cookies, définissez des cookies avec l'un ou les deux noms suivants : firebase-country-override et firebase-language-override. Par exemple, l'extrait de code JavaScript suivant remplace le code pays par ca et l'en-tête Accept-Language par fr,en :

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

Les remplacements de cookies de langue doivent être une liste de codes de langue séparés par une virgule, par ordre de préférence, sans sous-tags ni valeurs de qualité.

Les remplacements de cookies ne sont pas pris en compte dans les journaux.