Présentation

Dans cet atelier, vous allez exploiter Cloud Debugger et Error Reporting pour diagnostiquer et corriger les erreurs dans l'application en cours d'exécution.

Objectifs

Dans cet atelier, vous allez apprendre à effectuer les tâches suivantes :

• Créer un dépôt Cloud Source Repositories et y envoyer le code de l'application

• Installer et configurer Cloud Debugger

• Utiliser les instantanés et les points de journalisation du débogage pour capturer et afficher les variables de l'application

• Installer et configurer Cloud Error Reporting

• Identifier les erreurs dans l'application à l'aide de Cloud Error Reporting

Prérequis

Pour chaque atelier, nous vous attribuons un nouveau projet Google Cloud et un nouvel ensemble de ressources pour une durée déterminée, sans frais.

1. Connectez-vous à Qwiklabs dans une fenêtre de navigation privée.

2. Vérifiez le temps imparti pour l'atelier (par exemple : 01:15:00) : vous devez pouvoir le terminer dans ce délai.
   Une fois l'atelier lancé, vous ne pouvez pas le mettre en pause. Si nécessaire, vous pourrez le redémarrer, mais vous devrez tout reprendre depuis le début.

3. Lorsque vous êtes prêt, cliquez sur Démarrer l'atelier.

4. Notez vos identifiants pour l'atelier (Nom d'utilisateur et Mot de passe). Ils vous serviront à vous connecter à Google Cloud Console.

5. Cliquez sur Ouvrir la console Google.

6. Cliquez sur Utiliser un autre compte, puis copiez-collez les identifiants de cet atelier lorsque vous y êtes invité.
   Si vous utilisez d'autres identifiants, des messages d'erreur s'afficheront ou des frais seront appliqués.

7. Acceptez les conditions d'utilisation et ignorez la page concernant les ressources de récupération des données.

Activer Google Cloud Shell

Google Cloud Shell est une machine virtuelle qui contient de nombreux outils pour les développeurs. Elle comprend un répertoire d'accueil persistant de 5 Go et s'exécute sur Google Cloud. Google Cloud Shell offre un accès en ligne de commande à vos ressources GCP.

1. Dans la barre d'outils située en haut à droite de la console GCP, cliquez sur le bouton Open Cloud Shell (Ouvrir Cloud Shell).

   

2. Cliquez sur Continue (Continuez):

   

Le provisionnement et la connexion à l'environnement ne devraient pas prendre plus de quelques minutes. Une fois connecté, vous êtes en principe authentifié et le projet est défini sur votre ID_PROJET. Exemple :

gcloud est l'outil de ligne de commande associé à Google Cloud Platform. Pré-installé sur Cloud Shell, il est également compatible avec la saisie semi-automatique via la touche de tabulation.

Vous pouvez répertorier le nom des comptes actifs à l'aide de cette commande :

gcloud auth list

Résultat :

Credentialed accounts:
 - <myaccount>@<mydomain>.com (active)

Exemple de résultat :

Credentialed accounts:
 - google1623327_student@qwiklabs.net

Pour répertorier les ID de projet, exécutez la commande suivante :

gcloud config list project

Résultat :

[core]
project = <ID_projet>

Exemple de résultat :

[core]
project = qwiklabs-gcp-44776a13dea667a6

Préparer l'application de l'étude de cas

Dans cette section, vous allez accéder à Cloud Shell, cloner le dépôt Git qui contient l'application Quiz, configurer les variables d'environnement et exécuter l'application.

Cloner le code source dans Cloud Shell

1. Pour cloner le dépôt du cours, exécutez la commande suivante :

git clone --depth=1 https://github.com/GoogleCloudPlatform/training-data-analyst

2. Créez un lien symbolique qui servira de raccourci vers votre répertoire de travail.

ln -s ~/training-data-analyst/courses/developingapps/v1.3/nodejs/stackdriver-debug-errorreporting ~/stackdriver-debug-errorreporting

Configurer et exécuter l'application de l'étude de cas

1. Accédez au répertoire qui contient les exemples de fichiers de l'atelier :

cd ~/stackdriver-debug-errorreporting/start

2. Pour configurer l'application Quiz, exécutez la commande suivante :

. prepare_incomplete_environment.sh

Créer un dépôt Cloud Source Repositories

Dans cette section, vous aller créer un dépôt Cloud Source Repositories et y envoyer le code de l'application Quiz utilisée dans cet atelier.

Créer un dépôt Cloud Source Repositories

1. Dans la console Cloud Platform, accédez au menu de navigation, puis cliquez sur Source Repositories (Dépôts sources).
2. Cliquez sur Add repository (Ajouter un dépôt) en haut à droite.
3. Sélectionnez Create new repository (Créer un dépôt), puis cliquez sur Continue (Continuer).
4. Nommez le dépôt default, puis sélectionnez le projet nommé selon votre ID de projet GCP dans le menu déroulant Project (Projet).
5. Cliquez sur Create (Créer).

La boîte de dialogue Add code to your repository (Ajouter du code à votre dépôt) s'ouvre.

Cloner le dépôt

1. Retournez dans la fenêtre Cloud Shell.

2. Pour modifier le répertoire de travail et revenir au dossier de base, exécutez la commande suivante :

cd ~

3. Pour cloner le dépôt Cloud Source Repositories par défaut, exécutez la commande suivante :

gcloud source repos clone default

4. Pour copier dans le dépôt les fichiers de l'application Quiz enregistrés dans le dossier de l'atelier, exécutez la commande suivante :

cp -r ~/stackdriver-debug-errorreporting/start/quiz-app/* ~/default

5. Passez au répertoire de travail default.

cd ~/default

6. Créez un fichier .gitignore dans le dossier default pour éviter que le dossier node_modules ne soit inclus dans les commandes git ultérieures.

echo node_modules > .gitignore

7. Saisissez la commande git permettant d'ajouter les fichiers à valider.

git add .

8. Saisissez les commandes permettant de configurer git avec votre adresse e-mail et votre nom.

git config --global user.email "student@example.com" git config --global user.name "A Student"

9. Saisissez la commande git pour valider les modifications avec le message "Quiz application initial check-in".

git commit -m "Quiz application initial check-in"

10. Saisissez la commande git pour envoyer les modifications dans le dépôt par défaut.

git push

11. Retournez dans la fenêtre Source Repository (Dépôt source) et actualisez l'onglet du navigateur.

Utiliser Cloud Debugger

Dans cette section, vous allez écrire le code permettant de créer et de lancer Cloud Debugger dans l'application Quiz. Vous définirez ensuite les instantanés et points de journalisation de débogage dans la console Cloud Platform.

Écrire le code pour configurer Cloud Debugger

1. Dans Cloud Shell, afin d'installer l'agent Node.js pour Cloud Debugger, exécutez la commande suivante :

cd ~/default npm install --save @google-cloud/debug-agent

2. Cliquez sur Open Editor (Ouvrir l'éditeur).

Si une erreur indique que l'éditeur de code n'a pas pu être chargé parce que les cookies tiers sont désactivés, cliquez sur Open in New Window (Ouvrir dans une nouvelle fenêtre) et basculez vers le nouvel onglet.

3. Dans le fichier default/app.js, importez le module @google-cloud/debug-agent, puis démarrez-le. Pour plus d'informations, consultez la page : https://cloud.google.com/debugger/docs/setup/nodejs.

default/app.js

// TODO: Add the following statement to import and start // Stackdriver debug-agent // The start(...) method takes an 'options' object that you // can use to configure the Cloud Debugger agent. // You will need to pass through an object with an // allowExpressions Boolean property set to true. require('@google-cloud/debug-agent').start({ allowExpressions: true }); // END TODO

4. Enregistrez le fichier.

Mettre à jour le dépôt Cloud Source Repositories et créer un fichier de contexte source

1. Retournez dans la fenêtre Cloud Shell.

Si Cloud Shell n'est pas visible, cliquez sur Open Terminal (Ouvrir le terminal).

2. Pour ajouter, valider et envoyer les modifications dans le dépôt Cloud Source Repositories par défaut, exécutez les commandes suivantes :

cd ~/default git add . git commit -m "Added Cloud Debug Agent" git push

3. Pour produire le fichier de contexte source, exécutez la commande suivante :

gcloud debug source gen-repo-info-file --output-directory .

Déboguer l'application Web avec un instantané

1. Pour installer les dépendances de l'application Quiz et la lancer, exécutez la commande suivante :

npm install npm start

2. Lorsque App listening on port 8080 s'affiche, cliquez sur Web preview > Preview on port 8080 (Aperçu sur le Web > Prévisualiser sur le port 8080) pour prévisualiser l'application Quiz.
3. Retournez à la console Cloud Platform.
4. Dans le menu de navigation, cliquez sur Debugger.

5. Sélectionnez le fichier web-app/questions.js à l'aide du navigateur de code source.
6. Localisez le gestionnaire POST où sont ajoutées les questions (router.post('/add..)), puis cliquez sur le numéro de ligne situé à gauche de l'instruction vide qui suit let data = req.body. Cliquez sur Create snapshot (Créer un instantané).

7. Retournez dans l'application Quiz, puis cliquez sur Create Question (Créer une question).
8. Remplissez le formulaire à l'aide des valeurs suivantes, puis cliquez sur Save (Enregistrer).

Champ du formulaire	Valeur
Author (Auteur)	Votre nom
Quiz	Google Cloud Platform
Titre	Quelles propositions sont des produits Google Cloud ?
Answer 1 (Réponse 1)	Debug
Answer 2 (Réponse 2)	Error Reporting
Answer 3 (Réponse 3)	Logging
Answer 4 (Réponse 4)	Toutes les propositions ci-dessus (sélectionnez la réponse 4 comme étant la bonne)

9. Retournez dans la fenêtre Cloud Debug (Débogage Cloud) de la console Cloud Platform.

10. Développez la variable data.

Déboguer l'application Web avec un point de journalisation

1. Toujours dans le fichier questions.js, cliquez sur l'onglet Logpoint (Point de journalisation) du panneau de droite de la fenêtre Debug (Débogage).
2. Cliquez sur la ligne de code source utilisée pour insérer l'instantané, puis sur Create logpoint (Créer un point de journalisation).

3. Écrivez l'instruction de journalisation ci-dessous, puis cliquez sur Add (Ajouter).

if (true) logpoint("Quiz = {data.quiz}")

Cette instruction de journalisation affiche la valeur du champ Quiz du formulaire.

4. Retournez dans l'application Quiz, puis cliquez sur Create Question (Créer une question).
5. Remplissez le formulaire à l'aide des valeurs suivantes, puis cliquez sur Save (Enregistrer).

Champ du formulaire	Valeur
Author (Auteur)	Votre nom
Quiz	Google Cloud Platform
Titre	Quel produit Google Cloud inclut des instantanés et des points de journalisation ?
Answer 1 (Réponse 1)	Debugger (sélectionnez la réponse 1 comme étant la bonne)
Answer 2 (Réponse 2)	Error Reporting
Answer 3 (Réponse 3)	Logging
Answer 4 (Réponse 4)	All of the above

6. Retournez dans la fenêtre Cloud Shell.

Utiliser Cloud Error Reporting

Dans cette section, vous allez écrire le code permettant d'intégrer Cloud Error Reporting dans l'application Quiz, et examiner les erreurs dans l'application Web et Cloud Functions.

Écrire le code pour configurer Cloud Error Reporting

1. Dans Cloud Shell, appuyez sur Ctrl+C pour arrêter l'application Web.

2. Afin d'installer la bibliothèque Node.js pour Cloud Error Reporting, exécutez la commande suivante :

cd ~/default npm install --save @google-cloud/error-reporting

3. Dans l'éditeur de code Cloud Shell, accédez à default/app.js.

4. Dans le fichier app.js, chargez le module @google-cloud/error-reporting.

5. Créez le client Cloud Error Reporting.

default/app.js

// TODO: Load the error-reporting module const {ErrorReporting} = require( '@google-cloud/error-reporting'); // END TODO const path = require('path'); const express = require('express'); const config = require('./config'); const app = express(); // TODO: Create the errorReporting client object const errorReporting = new ErrorReporting(); // END TODO

6. Configurez l'application pour utiliser Cloud Error Reporting avec Express.

default/app.js

// TODO: Use Stackdriver Error Reporting // middleware for Express app.use(errorReporting.express); // END TODO

7. Enregistrez le fichier.

Mettre à jour le dépôt Cloud Source Repositories et créer un fichier de contexte source

1. Revenez à la fenêtre Cloud Shell et exécutez les commandes suivantes pour ajouter, valider et transmettre les modifications au référentiel Cloud Source par défaut :

cd ~/default git add . git commit -m "Added Cloud Error Reporting" git push

2. Pour créer le fichier de contexte source, exécutez la commande suivante :

gcloud debug source gen-repo-info-file --output-directory .

Afficher les erreurs de l'application Web dans Error Reporting

1. Par défaut, Cloud Error Reporting n'est actif que lorsque l'application est en production. Exportez une variable d'environnement NODE_ENV avec la valeur production.

export NODE_ENV=production

2. Pour lancer l'application, exécutez la commande suivante :

npm start

3. Prévisualisez l'application Web.
4. Retournez à la console Cloud Platform.
5. Dans le menu de navigation, cliquez sur Error Reporting.

6. Retournez dans l'application Quiz, puis cliquez sur Take Test (Faire le test).
7. Cliquez sur Places (Lieux).
8. Effectuez le quiz, saisissez une note et des commentaires, puis cliquez sur Send Feedback (Envoyer des commentaires).

9. Retournez à la console Cloud Platform.
10. Dans le menu de navigation, cliquez sur Error Reporting.
11. Cliquez sur Auto Reload (Actualisation automatique).

Afficher les erreurs Cloud Functions dans Error Reporting

1. Revenez à Cloud Shell, puis arrêtez l'application Web en appuyant sur Ctrl+C.

2. Pour créer le sujet Pub/Sub manquant, exécutez la commande suivante :

gcloud pubsub topics create feedback

3. Pour créer la fonction Cloud qui s'abonne au sujet "feedback" et insère un enregistrement dans Cloud Spanner, exécutez les commandes suivantes :

cd ~/stackdriver-debug-errorreporting/start/ gcloud functions deploy process-feedback --runtime nodejs14 \ --trigger-topic feedback --source ./function \ --stage-bucket $GCLOUD_BUCKET --entry-point subscribe cd ~/default

4. Pour lancer l'application Web, exécutez la commande suivante :

npm start

5. Prévisualisez l'application Web.
6. Retournez dans l'application Quiz, puis cliquez sur Take Test (Faire le test).
7. Cliquez sur Places (Lieux).
8. Effectuez le quiz, saisissez une note et des commentaires, puis cliquez sur Send Feedback (Envoyer des commentaires).

9. Retournez à la console Cloud Platform.
10. Dans le menu de navigation, cliquez sur Error Reporting.

11. Cliquez sur le lien Error: ERROR processing feedback:.

12. Dans la section Recent samples (Exemples récents) de la fenêtre, cliquez sur le lien View logs (Afficher les journaux) associé à l'erreur Cloud Functions.

13. Pour créer la base de données et la table Feedback, retournez dans Cloud Shell, arrêtez l'application Web, puis exécutez la commande suivante :

gcloud spanner databases create quiz-database --instance quiz-instance --ddl "CREATE TABLE Feedback ( feedbackId STRING(100) NOT NULL, email STRING(100), quiz STRING(20), feedback STRING(MAX), rating INT64, score FLOAT64, timestamp INT64 ) PRIMARY KEY (feedbackId);"

Bonus : Trouver une erreur logique dans l'application Quiz

Dans cette section, vous allez trouver une erreur dans l'application Quiz et utiliser Cloud Debugger pour en identifier la cause.

Reproduire l'erreur détectée dans l'application Quiz

1. Lancez l'application Web.
2. Accédez à la page d'accueil de l'application Quiz, puis cliquez sur Take Test (Faire le test).
3. Cliquez sur Places (Lieux).
4. Répondez correctement à la question.
5. Cliquez sur GCP, puis une nouvelle fois sur Places (Lieux).
6. Donnez une mauvaise réponse à la question.
7. Quel score s'affiche ?

Terminer l'atelier

Une fois l'atelier terminé, cliquez sur Terminer l'atelier. Google Cloud Skills Boost supprime les ressources que vous avez utilisées, puis efface le compte.

Si vous le souhaitez, vous pouvez noter l'atelier. Sélectionnez un nombre d'étoiles, saisissez un commentaire, puis cliquez sur Envoyer.

Le nombre d'étoiles correspond à votre degré de satisfaction :

• 1 étoile = très insatisfait(e)
• 2 étoiles = insatisfait(e)
• 3 étoiles = ni insatisfait(e), ni satisfait(e)
• 4 étoiles = satisfait(e)
• 5 étoiles = très satisfait(e)

Si vous ne souhaitez pas donner votre avis, vous pouvez fermer la boîte de dialogue.

Pour soumettre des commentaires, suggestions ou corrections, veuillez accéder à l'onglet Assistance.

Copyright 2020 Google LLC Tous droits réservés. Google et le logo Google sont des marques de Google LLC. Tous les autres noms d'entreprises et de produits peuvent être des marques des entreprises auxquelles ils sont associés.