Déployer un site Web avec Cloud Run

L'exécution de sites Web peut s'avérer difficile en raison des frais généraux liés à la création et à la gestion d'instances de machines virtuelles (VM), de clusters, de pods, de services, etc. Cela ne pose pas de problème pour les applications plus importantes et à plusieurs niveaux, mais, si vous cherchez simplement à déployer et à assurer la visibilité de votre site Web, cela représente des frais généraux conséquents.

Avec Cloud Run, l'implémentation Google Cloud de Knative, vous pouvez gérer et déployer votre site Web sans les frais généraux liés aux déploiements sur des VM ou Kubernetes. Il s'agit non seulement d'une approche plus simple du point de vue de la gestion, mais cela vous permet également d'effectuer un scaling à zéro instance lorsqu'aucune demande n'arrive sur votre site Web.

Cloud Run introduit le développement sans serveur dans les conteneurs. Il peut également être exécuté sur vos propres clusters Google Kubernetes Engine (GKE) ou sur une solution PaaS (Platform as a Service) entièrement gérée fournie par Cloud Run. Vous testerez ce deuxième scénario dans cet atelier de programmation.

Le schéma suivant illustre le flux du déploiement et de l'hébergement Cloud Run. Vous commencerez avec une image Docker créée à l'aide de Cloud Build, que vous déclencherez dans Cloud Shell. Vous allez ensuite déployer cette image dans Cloud Run à l'aide d'une commande dans Cloud Shell.

Prérequis

Points abordés

  • Créer une image Docker avec Cloud Build et la mettre en ligne sur gcr.io
  • Le déploiement d'images Docker dans Cloud Run
  • La gestion des déploiements dans Cloud Run
  • Configurer un point de terminaison pour une application sur Cloud Run

Ce que vous allez faire

  • Un site Web statique qui s'exécute dans un conteneur Docker
  • Version de ce conteneur qui se trouve dans Container Registry
  • Un déploiement Cloud Run pour votre site Web statique

Prérequis

  • Un compte Google disposant d'un accès administrateur pour créer des projets ou un projet avec le rôle de propriétaire du projet

Configuration de l'environnement au rythme de chacun

Si vous ne possédez pas encore de compte Google, vous devez en créer un. Ensuite, connectez-vous à la console Google Cloud, puis cliquez sur Projet > Créer un projet.

Retenez l'ID du projet, qui est automatiquement renseigné sous le nom de votre projet. L'ID du projet est un nom unique pour tous les projets Google Cloud. Le nom indiqué dans la capture d'écran est donc déjà pris et ne fonctionnera pas pour vous. Il sera désigné par le nom PROJECT_ID tout au long de cet atelier de programmation.

Vous devez ensuite activer la facturation dans la console Cloud pour utiliser les ressources Google Cloud et activer l'API Cloud Run.

Activer l'API Cloud Run

Cliquez sur le menu de navigation ☰ > API et services > Tableau de bord > Activer les API et les services. .

Recherchez "API Cloud Run", puis cliquez sur API Cloud Run> Activer.

Suivre cet atelier de programmation ne devrait pas vous coûter plus d'un euro. Cependant, cela peut s'avérer plus coûteux si vous décidez d'utiliser davantage de ressources ou si vous n'interrompez pas les ressources (voir Nettoyer à la fin). Pour en savoir plus, reportez-vous à la page Tarifs.

Les nouveaux utilisateurs de Google Cloud peuvent s'inscrire à un essai sans frais pour bénéficier d'un crédit de 300$valable pour un essai sans frais.

Cloud Shell

Bien que vous puissiez utiliser Google Cloud et Cloud Run à distance depuis votre ordinateur portable, vous allez utiliser Cloud Shell, un environnement de ligne de commande exécuté dans Google Cloud. L'environnement est préconfiguré avec toutes les bibliothèques clientes et tous les frameworks dont vous avez besoin.

Cette machine virtuelle basée sur Debian contient tous les outils de développement dont vous aurez besoin. Elle intègre un répertoire d'accueil persistant de 5 Go et s'exécute sur Google Cloud, ce qui améliore nettement les performances du réseau et l'authentification. Cela signifie que tout ce dont vous avez besoin pour cet atelier de programmation est un navigateur (oui, tout fonctionne sur un Chromebook).

Pour activer Google Cloud Shell, cliquez simplement sur le bouton en haut à droite de la console de développement (le provisionnement de l'environnement et la connexion ne devraient prendre que quelques minutes) :

activateCloudShell.png

Cliquez sur le bouton "Démarrer Cloud Shell" :

Capture d'écran du 2017-06-14 à 10.13.43 PM.png

Une fois connecté à Cloud Shell, vous êtes normalement déjà authentifié et le projet PROJECT_ID est sélectionné :

gcloud auth list

Résultat de la commande

Credentialed accounts:
 - <myaccount>@<mydomain>.com (active)
gcloud config list project

Résultat de la commande

[core]
project = <PROJECT_ID>

Par défaut, Cloud Shell définit certaines variables d'environnement qui pourront s'avérer utiles pour exécuter certaines commandes dans le futur.

echo $GOOGLE_CLOUD_PROJECT

Résultat de la commande

<PROJECT_ID>

Si, pour une raison quelconque, le projet n'est pas défini, exécutez simplement la commande suivante :

gcloud config set project <PROJECT_ID>

Vous recherchez votre PROJECT_ID ? Vérifiez l'ID que vous avez utilisé pendant les étapes de configuration ou recherchez-le dans le tableau de bord de la console :

Project_ID.png

IMPORTANT : Pour finir, définissez la configuration du projet et de la zone par défaut :

gcloud config set compute/zone us-central1-f

Vous pouvez choisir parmi différentes zones. Pour en savoir plus, consultez la documentation sur les régions et les zones.

Puisque vous déployez un site Web existant, il vous suffit de cloner la source depuis votre dépôt, ce qui vous permet de vous concentrer sur la création d'images Docker et sur leur déploiement dans Cloud Run.

Exécutez les commandes suivantes pour cloner le dépôt dans votre instance Cloud Shell et accéder au répertoire approprié. Vous allez également installer les dépendances Node.js de manière à pouvoir tester votre application avant de la déployer.

cd ~
git clone https://github.com/googlecodelabs/monolith-to-microservices.git
cd ~/monolith-to-microservices
./setup.sh

Cela clone votre dépôt, accède au répertoire et installe les dépendances nécessaires pour exécuter votre application en local. L'exécution du script peut prendre quelques minutes.

Faites preuve de diligence raisonnable et testez votre application. Exécutez la commande suivante pour démarrer votre serveur Web :

cd ~/monolith-to-microservices/monolith
npm start

Sortie :

Monolith listening on port 8080!

Vous pouvez prévisualiser votre application en cliquant sur Aperçu sur le Web, puis en sélectionnant Prévisualiser sur le port 8080.

Une nouvelle fenêtre s'ouvre, dans laquelle vous pouvez voir votre site Fancy Store en ligne.

Vous pouvez fermer cette fenêtre après avoir visualisé le site Web. Pour arrêter le processus du serveur Web, appuyez sur CONTROL+C (Command+C sur Macintosh) dans la fenêtre de terminal.

Maintenant que vos fichiers sources sont prêts à l'emploi, il est temps de déployer votre application dans un conteneur Docker.

En temps normal, vous devriez adopter une approche en deux étapes consistant à créer un conteneur Docker, puis à le transférer vers un registre afin de stocker l'image pour que GKE puisse l'extraire. Toutefois, vous pouvez vous simplifier la vie en utilisant Cloud Build pour créer le conteneur Docker et pour placer l'image dans Container Registry avec une seule commande. Pour découvrir comment créer et transférer un fichier Dockerfile manuellement, consultez le Guide de démarrage rapide pour Container Registry.

Cloud Build compresse les fichiers du répertoire et les déplace vers un bucket Cloud Storage. Le processus de compilation récupère ensuite tous les fichiers du bucket et exécute le processus de compilation Docker à l'aide du Dockerfile, qui se trouve dans le même répertoire. Étant donné que vous avez spécifié l'option --tag avec l'hôte en tant que gcr.io pour l'image Docker, l'image Docker résultante sera transférée vers Container Registry.

Pour commencer, assurez-vous que l'API Cloud Build est activée. Exécutez la commande suivante pour l'activer :

gcloud services enable cloudbuild.googleapis.com

Une fois l'API activée, exécutez la commande suivante dans Cloud Shell pour lancer le processus de compilation :

gcloud builds submit --tag gcr.io/${GOOGLE_CLOUD_PROJECT}/monolith:1.0.0 .

Ce processus prend quelques minutes, mais une fois terminé, la sortie sur le terminal ressemble à ceci :

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
ID                                    CREATE_TIME                DURATION  SOURCE                                                                                  IMAGES                              STATUS
1ae295d9-63cb-482c-959b-bc52e9644d53  2019-08-29T01:56:35+00:00  33S       gs://<PROJECT_ID>_cloudbuild/source/1567043793.94-abfd382011724422bf49af1558b894aa.tgz  gcr.io/<PROJECT_ID>/monolith:1.0.0  SUCCESS

Pour consulter votre historique de compilation ou suivre le processus en temps réel, accédez à la console Cloud, puis cliquez sur Menu de navigation ☰> Cloud Build > Historique. La liste de toutes vos compilations précédentes s'affiche ici. Seule celle que vous venez de créer devrait donc apparaître.

Si vous cliquez sur l'ID de compilation, vous pouvez consulter tous les détails de cette compilation, y compris la sortie du journal. Vous pouvez consulter l'image de conteneur créée en cliquant sur le lien à côté de Image.

Maintenant que vous avez conteneurisé votre site Web et que vous l'avez transféré vers Container Registry, il est temps de le déployer sur Cloud Run.

Deux approches sont possibles pour le déploiement dans Cloud Run :

  • Cloud Run (entièrement géré) est le modèle PaaS dans lequel l'ensemble du cycle de vie des conteneurs est géré. Vous utiliserez cette approche pour cet atelier de programmation.
  • Cloud Run pour Anthos est une version de Cloud Run avec une couche de contrôle supplémentaire, qui vous permet d'utiliser vos clusters et pods provenant de GKE. Pour en savoir plus, consultez Configurer Cloud Run for Anthos sur Google Cloud.

Les exemples de ligne de commande seront dans Cloud Shell, à l'aide des variables d'environnement que vous avez configurées précédemment.

Ligne de commande

Exécutez la commande suivante pour déployer votre application :

gcloud run deploy --image=gcr.io/${GOOGLE_CLOUD_PROJECT}/monolith:1.0.0 --platform managed 

Vous serez invité à indiquer la région dans laquelle vous souhaitez exécuter le code. Sélectionnez la région la plus proche de vous, puis acceptez le nom de service suggéré par défaut (monolith).

À des fins de test, autorisez les requêtes non authentifiées dans l'application. Saisissez y à l'invite.

Vérifier le déploiement

Pour vérifier que le déploiement a bien été créé, exécutez la commande suivante. La préparation de Pod status peut prendre quelques instants :Running

gcloud run services list

Sélectionnez [1] Cloud Run (entièrement géré).

Sortie :

SERVICE   REGION    URL  LAST DEPLOYED BY          LAST DEPLOYED AT
✔  monolith  us-east1 <your url>  <your email>  2019-09-16T21:07:38.267Z

Ce résultat vous indique différentes choses. Vous pouvez voir votre déploiement, l'utilisateur responsable du déploiement (votre adresse e-mail) et l'URL que vous pouvez utiliser pour accéder à l'application. Tous les éléments semblent avoir été créés correctement.

Ouvrez l'URL fournie dans la liste des services dans votre navigateur Web. Le site Web qui s'affiche devrait être le même que celui dont vous avez affiché l'aperçu localement.

Déployez votre application à nouveau, mais cette fois-ci, ajustez l'un des paramètres.

Par défaut, la valeur de simultanéité d'une application Cloud Run correspond à 80, ce qui signifie que chaque instance de conteneur peut traiter jusqu'à 80 requêtes à la fois. Cela représente un écart important par rapport au modèle Functions as a Service (FaaS), dans lequel une instance traite une requête à la fois.

Redéployez la même image de conteneur avec une valeur de simultanéité correspondant à 1 (pour les tests uniquement), et observez le résultat.

gcloud run deploy --image=gcr.io/${GOOGLE_CLOUD_PROJECT}/monolith:1.0.0 --platform managed --concurrency 1

Répondez aux questions suivantes comme vous l'avez fait la première fois. Une fois la commande réussie, consultez la console Cloud pour afficher le résultat.

Dans le tableau de bord Cloud Run, cliquez sur le service monolith pour afficher les détails.

Cliquez sur l'onglet Révisions. Deux révisions devraient s'afficher. Cliquez sur monolith-00002 et examinez les détails. Vous devriez constater que la valeur de simultanéité a été réduite à 1.

]

Même si cette configuration est suffisante pour les tests, dans la plupart des scénarios de production, les conteneurs prennent en charge plusieurs requêtes simultanées.

Rétablissez ensuite la simultanéité d'origine sans redéploiement. Vous pouvez définir la valeur de simultanéité sur la valeur par défaut de 80 ou sur 0, ce qui supprimera toute restriction de simultanéité et définira la valeur maximale par défaut (qui est de 80 au moment de la rédaction de cet article).

Exécutez la commande suivante dans Cloud Shell pour mettre à jour la révision actuelle :

gcloud run deploy --image=gcr.io/${GOOGLE_CLOUD_PROJECT}/monolith:1.0.0 --platform managed --concurrency 80

Vous constaterez qu'une autre révision a été créée, que le trafic a été redirigé et que la simultanéité est à nouveau de 80.

Votre équipe marketing vous a demandé de modifier la page d'accueil du site Web de votre entreprise. Elle estime en effet que cette page doit fournir plus d'informations sur l'entreprise et sur les produits qu'elle commercialise. Dans cette section, vous allez ajouter du texte à la page d'accueil pour répondre aux attentes de l'équipe marketing.

L'un de vos développeurs a déjà spécifié les modifications souhaitées dans le fichier index.js.new. Il vous suffit donc de copier le contenu de ce fichier dans le fichier index.js pour répercuter vos modifications. Suivez les instructions pour apporter les modifications appropriées.

Exécutez les commandes suivantes pour copier le fichier mis à jour sous le nom de fichier correct, puis affichez le contenu de ce fichier pour vérifier les modifications :

cd ~/monolith-to-microservices/react-app/src/pages/Home
mv index.js.new index.js
cat ~/monolith-to-microservices/react-app/src/pages/Home/index.js

Le code obtenu doit se présenter comme suit :

/*
Copyright 2019 Google LLC

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    https://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/

import React from "react";
import { makeStyles } from "@material-ui/core/styles";
import Paper from "@material-ui/core/Paper";
import Typography from "@material-ui/core/Typography";
const useStyles = makeStyles(theme => ({
  root: {
    flexGrow: 1
  },
  paper: {
    width: "800px",
    margin: "0 auto",
    padding: theme.spacing(3, 2)
  }
}));
export default function Home() {
  const classes = useStyles();
  return (
    <div className={classes.root}>
      <Paper className={classes.paper}>
        <Typography variant="h5">
          Fancy Fashion &amp; Style Online
        </Typography>
        <br />
        <Typography variant="body1">
          Tired of mainstream fashion ideas, popular trends and societal norms?
          This line of lifestyle products will help you catch up with the Fancy trend and express your personal style.
          Start shopping Fancy items now!
        </Typography>
      </Paper>
    </div>
  );
}

Vous avez mis à jour les composants React, mais vous devez compiler l'application React pour générer les fichiers statiques. Exécutez la commande suivante pour compiler l'application React et la copier dans le répertoire public "monolith" :

cd ~/monolith-to-microservices/react-app
npm run build:monolith

Maintenant que votre code a été mis à jour, vous devez recompiler votre conteneur Docker et le publier dans Container Registry. Vous pouvez utiliser la même commande que précédemment, mais cette fois en mettant à jour l'étiquette de la version.

Exécutez la commande suivante pour déclencher une nouvelle compilation Cloud Build avec la version d'image mise à jour de 2.0.0 :

cd ~/monolith-to-microservices/monolith

#Feel free to test your application
npm start

gcloud builds submit --tag gcr.io/${GOOGLE_CLOUD_PROJECT}/monolith:2.0.0 .

Dans la section suivante, vous allez utiliser cette image pour mettre à jour votre application sans aucun temps d'arrêt.

Les modifications ont été effectuées, puis validées par l'équipe marketing. Il est temps de mettre à jour le site Web sans interrompre le travail des utilisateurs.

Cloud Run traite chaque déploiement comme une nouvelle révision, qui est mise en ligne avant que le trafic y soit redirigé.

Suivez les instructions ci-dessous pour mettre à jour votre site Web.

Ligne de commande

Depuis la ligne de commande, vous pouvez redéployer le service pour remplacer l'image par une nouvelle version avec la commande suivante :

gcloud run deploy --image=gcr.io/${GOOGLE_CLOUD_PROJECT}/monolith:2.0.0 --platform managed

Vérifier le déploiement

Validez la mise à jour de votre déploiement en exécutant la commande suivante :

gcloud run services describe monolith --platform managed 

Le résultat ressemble à ceci :

apiVersion: serving.knative.dev/v1alpha1
kind: Service
metadata:
  annotations:
    client.knative.dev/user-image: gcr.io/my-cloudrun-codelab/monolith:2.0.0
...

Vous constaterez que votre service utilise désormais la dernière version de votre image, déployée dans une nouvelle révision.

Pour vérifier vos modifications, accédez à nouveau à l'URL externe de votre service Cloud Run et notez que le titre de votre application a été mis à jour.

Si vous avez oublié l'adresse IP, exécutez la commande suivante pour lister les services et l'afficher :

gcloud run services list

Votre site Web doit maintenant afficher le texte que vous avez ajouté au composant de la page d'accueil.

Supprimer des images Container Registry

# Delete the container image for version 1.0.0 of our monolith
gcloud container images delete gcr.io/${GOOGLE_CLOUD_PROJECT}/monolith:1.0.0 --quiet

# Delete the container image for version 2.0.0 of our monolith
gcloud container images delete gcr.io/${GOOGLE_CLOUD_PROJECT}/monolith:2.0.0 --quiet

Supprimer les artefacts Cloud Build de Cloud Storage

# The following command will take all source archives from all builds and delete them from cloud storage

# Run this command to print all sources:
# gcloud builds list | awk 'NR > 1 {print $4}' 

gcloud builds list | awk 'NR > 1 {print $4}' | while read line; do gsutil rm $line; done

Supprimer le service Cloud Run

gcloud run services delete monolith --platform managed

Vous avez déployé, mis à l'échelle et mis à jour votre site Web avec Cloud Run.

En savoir plus