Si compilas apps de Angular o Next.js procesadas por el servidor, consulta Firebase App Hosting de nueva generación, una solución de pila completa para frameworks web modernos.

Esta página se ha traducido con Cloud Translation API.

Configurar reescrituras de internacionalización (i18n)

Utilice reescrituras de internacionalización ("reescrituras i18n") para ofrecer contenido diferente según el país o el idioma preferido del usuario. A continuación se muestran algunos ejemplos de configuraciones que puede configurar:

Ofrezca el mismo contenido en francés a todos los usuarios que prefieran el francés (independientemente del país).
Ejemplo: una página de inicio con texto en francés
Ofrezca contenido en francés estándar a los usuarios que prefieran el francés, pero para los usuarios canadienses que prefieran el francés, proporcione contenido en francés canadiense.
Ejemplo: una página de inicio con redacción en francés estándar frente a una página de inicio con redacción en francés canadiense
Ofrecer el mismo contenido a todos los usuarios canadienses (independientemente de su preferencia de idioma).
Ejemplo: una página de inicio con el idioma "predeterminado" de su sitio pero con una característica específica de Canadá (como un tema festivo)
Ofrezca contenido en francés canadiense a usuarios canadienses que prefieran el francés.
Ejemplo: una página de inicio con redacción en francés canadiense y una característica específica de Canadá (como un tema festivo)

Firebase Hosting determina el país de un usuario a partir de su dirección IP y las preferencias de idioma del usuario a partir del encabezado de solicitud Accept-Language (generalmente configurado automáticamente por su navegador web ).

Configurar reescrituras i18n

Para configurar reescrituras de i18n para su sitio de hosting, debe crear un directorio de "contenido i18n" para todo su contenido localizado y luego agregar el atributo i18n a su archivo firebase.json para que apunte a su nuevo directorio de "contenido i18n".

Aquí están los pasos detallados:

Dentro de la carpeta public del directorio de su aplicación local, cree un directorio separado para su "contenido i18n" y luego cree subcarpetas para cada combinación de idioma y país admitida por su sitio.

En cada subcarpeta, agregue el contenido específico para esa combinación, como páginas de inicio con temas navideños o páginas 404 específicas de un idioma.

Aquí hay un ejemplo de directorio de "contenido i18n" llamado 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

Ver las solicitudes coincidentes para el contenido de cada subcarpeta

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

El directorio localized-files/ contiene subcarpetas separadas para cada combinación de idioma y país admitida por su sitio. El patrón de nomenclatura para cada subcarpeta debe seguir cualquiera de estos formatos:

languageCode_countryCode : Contiene contenido específico para usuarios que tienen esa preferencia de idioma y ese código de país.
languageCode : contiene contenido específico para usuarios que tienen esa preferencia de idioma, pero el contenido no es específico de un país; básicamente equivalente a languageCode_ALL

Consulte la subsección Códigos de país e idioma a continuación para obtener más detalles sobre estos códigos. Puede utilizar el valor de ALL (distingue entre mayúsculas y minúsculas) para indicar cualquier país (como es_ALL/ ) o cualquier idioma (como ALL_ca/ ).

No es necesario que los archivos de una subcarpeta tengan archivos análogos en el directorio public u otras subcarpetas. Puede crear contenido que sea completamente específico de un idioma y/o país.

Agregue el atributo i18n a su archivo firebase.json y especifique el directorio que contiene su "contenido i18n". Siguiendo con nuestro ejemplo:
```
// firebase.json

"hosting": {

  "public": "public",

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

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

  ...
}
```
El directorio especificado para root debe ser el nombre del directorio que contiene todas las subcarpetas de "contenido i18n". Si colocó todas sus subcarpetas de "contenido i18n" en la raíz de su directorio public , use / para el valor de root . Las barras diagonales iniciales y finales en el valor root son opcionales.
Implemente su "contenido i18n" y configúrelo en su sitio de alojamiento.

Puede probar su configuración mediante anulaciones de cookies .

Códigos de país e idioma

Al nombrar las subcarpetas de "contenido i18n", debe utilizar minúsculas tanto para los códigos de país como de idioma. Puede utilizar el valor de ALL (distingue entre mayúsculas y minúsculas) para indicar cualquier país (como es_ALL/ ) o cualquier idioma (como ALL_ca/ ).

Hosting obtiene el código de país de la dirección IP del usuario. Los códigos de país son códigos ISO 3166-1 alfa-2 de dos letras.

Los códigos de idioma se obtienen del encabezado de solicitud Accept-Language del usuario (generalmente configurado automáticamente por su navegador web ). Son códigos ISO 639-1 . Tenga en cuenta lo siguiente al utilizar códigos de idioma:

Cuando Hosting busca qué "contenido i18n" servir, ordena los idiomas según los valores de calidad en el encabezado Accept-Language .
Hosting elimina las subetiquetas regionales y de país en el encabezado Accept-Language , por lo que el código de idioma en el nombre de una subcarpeta "contenido i18n" no puede contener estas subetiquetas. Por ejemplo, no puedes usar es-419 o es-US como código de idioma en el nombre de una subcarpeta, pero puedes usar es .
Si desea ofrecer contenido regional o nacional específico, puede crear subcarpetas que contengan el contenido específico del idioma y del país que desea admitir.
Ver ejemplos para respaldar contenido regional o nacional específico
Ofrecer contenido en español aplicable para España frente a cualquier otro país (imitar el comportamiento de es-419 )
En este ejemplo, una solicitud de España con la preferencia de idioma es , es-es o incluso es-419 recibiría contenido de la subcarpeta es_es/ porque Hosting trata todos esos códigos de idioma como es .
Una solicitud de Estados Unidos, México o cualquier otro país con la preferencia de idioma es-419 recibiría contenido de la subcarpeta es_ALL/ porque Hosting trata a es-419 como 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
```
Ofrecer contenido en español aplicable a países específicos .
En este ejemplo, una solicitud de México con la preferencia de idioma es-419 recibiría contenido de la subcarpeta es_mx/ porque Hosting trata el código de idioma es-419 como es .
Sin embargo, una solicitud de Estados Unidos con la preferencia de idioma es-419 recibiría contenido de la subcarpeta es_ALL/ porque Hosting trata a es-419 como es y no hay una subcarpeta 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
```

Orden de prioridad para "contenido i18n"

Si configura reescrituras i18n, Hosting ofrece contenido según el siguiente orden de prioridad:

Espacios de nombres reservados que comienzan con un segmento de ruta /__/*
Redirecciones configuradas
Contenido estático de coincidencia exacta
1. Código de idioma + Código de país (por ejemplo, contenido de fr_ca/ )
  El orden sigue los valores de calidad para cada idioma en el encabezado Accept-Language de la solicitud.
2. Solo código de país (por ejemplo, contenido de ALL_ca/ )
3. Solo código de idioma (por ejemplo, contenido de fr/ o es_ALL/ )
  El orden sigue los valores de calidad para cada idioma en el encabezado Accept-Language de la solicitud.
4. Contenido estático de coincidencia exacta "predeterminado"
  Este es contenido que está fuera del directorio "contenido i18n", como en la raíz del directorio public .
Reescrituras configuradas
404 manejo
1. i18n 404 páginas
  Esto sigue el mismo orden de prioridad mencionado anteriormente para el contenido estático de coincidencia exacta.
2. Página 404 personalizada
3. Página 404 predeterminada (proporcionada por Firebase)

Ejemplo de orden de prioridad

Sigamos con nuestro ejemplo de arriba. Usaremos el mismo directorio de ejemplo y una solicitud de ejemplo.

Ejemplo de directorio de proyecto local con un directorio de "contenido i18n" (llamado 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

Ejemplo de información de solicitud
- Códigos de idioma: fr , en (francés, luego inglés)
  Los códigos de idioma se ordenan según los valores de calidad en el encabezado Accept-Language .
- Código de país: ca (Canadá)

De acuerdo con el orden de prioridad de coincidencia exacta y los valores de calidad para las preferencias de idioma, Hosting buscará en los directorios una página solicitada en el siguiente orden.

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 manejo

¿Qué página se mostrará al usuario?

Página solicitada: index.html
Respuesta
index.html de la subcarpeta fr_ca/
Dado que Hosting busca primero en la subcarpeta fr_ca/ , encontrará la coincidencia exacta para index.html en esa subcarpeta.
Página solicitada: awesome-page.html
Respuesta
404.html de la subcarpeta fr/
Hosting primero busca en todo el directorio (incluidas todas las subcarpetas de "contenido i18n" y el directorio raíz) en orden de prioridad para encontrar una coincidencia exacta, pero no hay una coincidencia exacta para awesome-page.html .
Entonces, Hosting comenzará su manejo 404, que sigue el mismo orden de prioridad i18n que las búsquedas de coincidencias exactas. La subcarpeta fr/ es la primera subcarpeta buscada que contiene una página 404.

Tenga en cuenta lo siguiente acerca de esta búsqueda y servicio del directorio "contenido i18n":

El directorio localized-files/ en realidad no contiene las subcarpetas en_ca/ , en_ALL/ o en/ , por lo que Hosting simplemente saltará la lista de prioridades hasta que encuentre una subcarpeta coincidente para la combinación de idioma y país de la solicitud.
Aunque el directorio localized-files/ contiene una subcarpeta es_ALL/ , la solicitud de ejemplo anterior no incluye un código de idioma es o es-foo , por lo que Hosting no buscará "contenido i18n" que coincida con es .
Las subcarpetas denominadas fr/ y fr_ALL/ son equivalentes desde la perspectiva del país y las preferencias de idioma del usuario. Sin embargo, si ambas subcarpetas existen, Hosting servirá el contenido fr_ALL/ antes que el contenido fr/ .

Puede cambiar el contenido que se ofrece utilizando cookies para anular los encabezados de país e idioma.

A continuación se muestran algunas formas en las que puede utilizar las anulaciones de cookies:

Pruebe una función con diferentes combinaciones de idioma/país para comprobar qué contenido se ofrece.
Permita que sus usuarios cambien el contenido que ven. Por ejemplo, puede implementar un selector de idioma y luego configurar la cookie firebase-language-override del usuario en consecuencia.

Para configurar la anulación de cookies, configura cookies con ambos o cualquiera de estos nombres: firebase-country-override y firebase-language-override . Por ejemplo, el siguiente fragmento de código JavaScript anula el código de país para que sea ca y el encabezado Accept-Language para que sea fr,en :

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

Las anulaciones de cookies de idioma deben ser una lista de códigos de idioma separados por comas en orden de preferencia, sin subetiquetas ni valores de calidad.

Las anulaciones de cookies no se reflejan en los registros.