Partager les ressources du projet entre plusieurs sites

Vous pouvez configurer un ou plusieurs sites Firebase Hosting dans un même projet Firebase. Étant donné que les sites se trouvent tous dans le même projet Firebase, ils peuvent tous accéder aux autres ressources Firebase du projet.

En configurant plusieurs sites Hosting dans le même projet Firebase, vous pouvez partager plus facilement les ressources Firebase entre les sites et les applications associés. Par exemple, si vous configurez votre blog, votre panneau d'administration et votre application publique en tant que sites individuels dans le même projet Firebase, ils peuvent tous partager la même base de données utilisateur Firebase Authentication, tout en ayant leurs propres domaines ou contenus uniques.

Étape 1: Mettre à jour la version de la CLI Firebase

Accédez aux dernières fonctionnalités Firebase Hosting en passant à la dernière version de la CLI Firebase.

Étape 2: Ajoutez des sites supplémentaires

Ajoutez des sites supplémentaires à un projet Firebase en utilisant l'une des méthodes suivantes:

  • Utiliser le workflow sur la page Hosting de la console Firebase

  • Utilisez la commande CLI Firebase : firebase hosting:sites:create SITE_ID

  • Utilisez l'API REST Hosting : projects.sites.create

Pour chacune de ces méthodes, vous devez spécifier un SITE_ID qui permet de créer les sous-domaines par défaut provisionnés par Firebase pour le site:

  • SITE_ID.web.app
  • SITE_ID.firebaseapp.com

Étant donné que SITE_ID est utilisé pour ces URL, l'ID de site doit respecter les conditions suivantes:

  • Doit être un libellé de nom d'hôte valide, ce qui signifie qu'il ne doit pas contenir ., _, etc.
  • 30 caractères maximum
  • Doit être unique dans Firebase

Vous pouvez également ajouter des domaines personnalisés à chaque site pour diffuser le même contenu et la même configuration sur plusieurs URL.

Supprimer un site secondaire

Supprimez les sites indésirables d'un projet Firebase à l'aide de l'une des méthodes suivantes:

  • Utiliser le workflow sur la page Hosting de la console Firebase

  • Utilisez la commande CLI Firebase : firebase hosting:sites:delete SITE_ID

  • Utilisez l'API REST Hosting : projects.sites.delete

Notez que vous ne pouvez pas supprimer le site par défaut, qui possède le même SITE_ID que votre ID de projet Firebase.

Étape 3: Configurer des cibles de déploiement pour vos sites

Lorsque vous avez plusieurs sites et que vous exécutez des commandes de déploiement de la CLI Firebase, la CLI a besoin d'un moyen de communiquer les paramètres à déployer sur chaque site. Les cibles de déploiement vous permettent d'identifier de manière unique un site spécifique avec un TARGET_NAME dans votre fichier de configuration firebase.json et dans vos commandes de CLI Firebase pour les tests ou le déploiement sur vos sites.

Pour créer une cible de déploiement et appliquer un TARGET_NAME à un site Hosting, exécutez la commande CLI suivante à partir de la racine du répertoire de votre projet:

firebase target:apply hosting TARGET_NAME RESOURCE_IDENTIFIER

où les paramètres sont les suivants:

  • TARGET_NAME : nom unique (que vous avez défini vous-même) pour le site Hosting sur lequel vous effectuez le déploiement

  • RESOURCE_IDENTIFIER : SITE_ID du site Hosting tel que listé dans votre projet Firebase

Par exemple, si vous avez créé deux sites (myapp-blog et myapp-app) dans votre projet Firebase, vous pouvez appliquer un TARGET_NAME unique (blog et app, respectivement) à chaque site en exécutant les commandes suivantes:

firebase target:apply hosting blog myapp-blog
firebase target:apply hosting app myapp-app

Les paramètres des cibles de déploiement sont stockés dans le fichier .firebaserc du répertoire de votre projet. Vous n'avez donc besoin de configurer les cibles de déploiement qu'une seule fois par projet.

Étape 4: Définir la configuration d'hébergement pour chaque site

Utilisez l'TARGET_NAME appliquée à un site lorsque vous définissez sa configuration d'hébergement dans votre fichier firebase.json.

  • Si votre fichier firebase.json définit la configuration pour plusieurs sites, utilisez un format de tableau:

    {
  "hosting": [ {
      "target": "blog",  // "blog" is the applied TARGET_NAME for the Hosting site "myapp-blog"
      "public": "blog/dist",  // contents of this folder are deployed to the site "myapp-blog"

      // ...
    },
    {
      "target": "app",  // "app" is the applied TARGET_NAME for the Hosting site "myapp-app"
      "public": "app/dist",  // contents of this folder are deployed to the site "myapp-app"

      // ...

      "rewrites": [...]  // You can define specific Hosting configurations for each site
    }
  ]
}

  • Si votre fichier firebase.json ne définit la configuration que pour un seul site, il n'est pas nécessaire d'utiliser un format de tableau:

    {
  "hosting": {
      "target": "blog",
      "public": "dist",

      // ...

      "rewrites": [...]
  }
}

Étape 5: Tester en local, prévisualiser les modifications et les déployer sur vos sites

Exécutez l'une des commandes suivantes à partir de la racine du répertoire de votre projet local.

Commande Description
firebase emulators:start --only hosting Émule le contenu et la configuration de Hosting du site Hosting par défaut sur une URL hébergée localement.
firebase emulators:start --only hosting:TARGET_NAME Émule le contenu et la configuration Hosting du site Hosting spécifié sur une URL hébergée localement
firebase hosting:channel:deploy \
CHANNEL_ID		 Déploie le contenu et la configuration Hosting du site Hosting par défaut à une URL d'aperçu.
firebase hosting:channel:deploy \
CHANNEL_ID --only TARGET_NAME		 Déploie le contenu et la configuration Hosting du site Hosting spécifié sur une URL d'aperçu.
firebase deploy --only hosting Déploie le contenu et la configuration Hosting sur le canal en direct de tous les sites Hosting configurés dans firebase.json.
firebase deploy --only hosting:TARGET_NAME Déploie le contenu et la configuration Hosting sur la chaîne en direct du site Hosting spécifié.
Commande Description
(non recommandé : utilisez plutôt emulators:start)
firebase serve --only hosting 		Fournit le contenu et la configuration Hosting du site Hosting par défaut à une URL hébergée localement.
(non recommandé : utilisez plutôt emulators:start)
firebase serve --only hosting:TARGET_NAME 		Fournit le contenu et la configuration Hosting du site Hosting spécifié sur une URL hébergée localement