Votre site statique en HTTPS avec Google Firebase

C’est lundi, et une nouvelle semaine commence dans les nuages. Pas le temps de laisser votre café vous faire atterrir, et voilà que Christina débarque dans votre bureau : “Mon chéri c’est magnifique ce que tu as fait pour Jean-René, mais moi je veux du Google Cloud, et du coup et je ne peux pas en profiter (smiley triste)”

Merci à Mathieu Roudaut et Sidney Mangoye pour la relecture de cet article

Christina c’est la responsable design de l’équipe, elle a toujours des idées bizarres et elle appelle tout le monde “chéri”, mais elle dégage une aura de sympathie assez puissante.

Pour le coup vous êtes embêtés, parce que vous n’avez pas le temps de vous occuper de ses problèmes, mais voilà soudain votre cheffe Sophie-Emmanuelle qui arrive au bureau.

Un “ma chérie” et trois bises plus tard vous voilà affecté à aider Christina sur Google Cloud. Vous n’avez pas tout compris, mais visiblement Sophie-Emanuelle ira faire du shopping avec Christina en échange.

Maintenant vous avez un autre problème, vous n’avez rien dit à Sophie-Emmanuelle pour ne pas ruiner sa négociation mais vous savez pas comment faire avec Google Cloud.

Appliquant alors une technique que vous avez appris chez les scouts, vous retournez sur le blog de d2si qui vous avait bien aidé avec Jean-René et PAF: Nicolas a encore fait un article pour vous. Le voici.

Posons les bases

Prenons quelques instants pour dessiner l’architecture que nous désirons et comment nous l’avions fait dans AWS:

Et avec Google Cloud ?

Un rapide tour sur Google vous amènera probablement à cette page.

C’est à priori ce qu’il nous faut mais il y a un hic, on veut du HTTPS avec notre domaine, et il est bien indiqué dans la documentation:

Caution: This tutorial applies to using HTTP. We recommend that you don’t serve content that contains sensitive or private data via HTTP from your Cloud Storage bucket. For options for serving content on a custom domain over HTTPS, see the related troubleshooting topic.

La partie de la documentation en question indique que pour utiliser du HTTPS avec Cloud storage, vous pourriez utiliser un load balancer. Mais en parcourant les spécifications du service de load balancing, vous constatez que pour attacher un certificat SSL à votre load balancer, il vous faudra en générer un de votre côté, et donc l’obtenir auprès d’une autorité de spécification, ou bien avoir un certificat auto-signé. Dans AWS, on avait la possibilité de générer un certificat gratuitement et l’attacher à CloudFront, c’était quand même plus facile, et surtout on n’avait pas besoin de payer un certificat HTTPS.

Références:

Firebase à la rescousse

Heureusement, il existe un service Google un peu à part appelé Firebase qui est capable d’adresser exactement ce besoin. Firebase peut s’utiliser seul, ou bien être relié à un projet Google Cloud.

Console Firebase

Pour commencer, allez sur la console de Firebase, et cliquez sur “Ajouter un projet”. Choisissez un nom pour votre projet, ou bien liez le projet Firebase à un projet Google Cloud existant.

Par défaut, vous allez voir que vous êtes en mode de facturation Spark. C’est l’équivalent du free tier chez AWS: certaines ressources vont être gratuites, dans une certaine limite. Plus de détails ici.

Cliquez sur “Développer” puis “Hosting”:

A partir de maintenant, cela va commencer à se compliquer. Là où chez AWS on pouvait tout faire en console, il va nous falloir installer les outils en ligne de commande de Firebase pour pouvoir uploader notre site internet.

Déploiement du site

Si vous ne l’avez pas, installez NPM:

Installez ensuite les outils de Firebase:

npm install -g firebase-tools

Connectez-vous à votre compte Google :

firebase login

La commande précédente ouvrira une fenêtre du navigateur pour confirmer que c’est bien vous.

Allez dans le répertoire dans lequel vous voulez travailler, et lancez :

firebase init

Cette commande va vous poser un certain nombre de questions, répondez “Hosting” lorsqu’on vous demande quel service initialiser. firebase init va créer un fichier firebase.json contenant la description des URLs de votre site. Plus de détails sont disponibles ici.

Si vous avez choisi de rattacher un projet à la création de votre environnement, vous aurez également un fichier .firebaserc contenant le nom de celui-ci.

Créez ou copiez les fichiers de votre site dans le dossier public du répertoire, puis lancez la commande:

firebase deploy

Vous pouvez immédiatement tester votre site à l’adresse: https://<votre identifiant de projet>.firebaseapp.com/

Utilisation de notre domaine

Il est temps désormais de connecter notre domaine. Dans la console web de firebase, cliquez simplement sur Connecter un domaine

Renseignez ensuite votre nom de domaine:

Ajoutez ensuite un pointage TXT comme indiqué, via votre hébergeur de domaine:

Attendez quelques minutes le temps de la propagation, puis cliquez sur continuer. Firebase va désormais vous donner des IPs sur lesquelles faire pointer votre domaine:

ATTENTION:

  • Utilisez des enregistrements A
  • Si vous avez d’autres pointages sur ce (sous) domaine, Firebase ne pourra pas générer de certificat pour celui-ci. Vous pouvez en revanche avoir des pointages sur d’autres sous-domaines sans problème.

En supposant que votre site ait comme URL test.example.com, votre fichier de zone va désormais ressembler à ceci:

@ 1800 IN TXT « google-site-verification=xxxxx »
test 1800 IN A 151.x.x.x
test 1800 IN A 151.x.x.x

Et maintenant ?

C’est fini, attendez juste que Firebase découvre qu’il existe un enregistrement A vers ses machines, et il exposera un nouveau certificat HTTPS avec votre domaine comme Alternative Name. En attendant, le site ne sera pas disponible en HTTPS, car le navigateur exposera une alerte comme quoi le nom DNS ne correspond pas. Cette validation peut prendre jusqu’à 2 heures, mais c’est en général assez rapide.

Documentation de référence:

Premiers pas avec Firebase Hosting

Ajouter son domaine personnalisé à Firebase Hosting

Conclusion

Vous l’avez vu, transposer ce que vous avez réalisé dans AWS vers un environnement Google Cloud (et inversement) est parfois périlleux car les services et leur philosophie sont très différentes, et vous ne serez pas forcément en mesure d’avoir les mêmes fonctionnalités d’un fournisseur à l’autre.

Néanmoins, si vous ne souhaitez pas utiliser AWS pour héberger votre site statique, vous avez des solutions chez Google, par l’intermédiaire de Firebase.

En ce qui concerne les coûts de chaque solution, là encore les philosophies sont différentes:

  • Dans AWS, vous avez la première année un free-tier, et si vous dépassez, vous paierez à la demande. Par la suite, la facturation standard (à la demande) s’applique.
  • Dans Firebase, vous avez de base un free-tier (facturation “Spark”) mais si vous dépassez, le site sera désactivé jusqu’au mois suivant où les compteurs sont remis à zéro. Vous avez la possibilité de passer immédiatement à une offre payante au forfait (par exemple 50Go de transfert par mois) ou à la demande (par exemple $0.15ct par Go de transfert)

Quel service vous coûtera le moins cher ? Là dessus, je peux vous répondre ma réplique préférée: cela dépend. Faites le calcul à partir des différentes offres, et faites votre choix:

Commentaires :

A lire également sur le sujet :