Visão geral

Neste laboratório, você usará o Cloud Debugger e o Error Reporting para diagnosticar e corrigir erros no aplicativo em execução.

Objetivos

Você aprenderá o seguinte:

• Criar um repositório do Cloud Source Repositories e inserir o código do aplicativo nele

• Instalar e configurar o Cloud Debugger

• Usar snapshots e logpoints de depuração para coletar e exibir variáveis do aplicativo

• Instalar e configurar o Cloud Error Reporting

• Usar o Cloud Error Reporting para identificar erros no aplicativo

Configuração e requisitos

Para cada laboratório, você recebe um novo projeto do Google Cloud e um conjunto de recursos por um determinado período e sem custos financeiros.

1. Faça login no Qwiklabs em uma janela anônima.

2. Confira o tempo de acesso do laboratório (por exemplo, 1:15:00) e finalize todas as atividades nesse prazo.
   Não é possível pausar o laboratório. Você pode reiniciar o desafio, mas vai precisar refazer todas as etapas.

3. Quando tudo estiver pronto, clique em Começar o laboratório.

4. Anote as credenciais (Nome de usuário e Senha). É com elas que você vai fazer login no Console do Google Cloud.

5. Clique em Abrir Console do Google.

6. Clique em Usar outra conta, depois copie e cole as credenciais deste laboratório nos locais indicados.
   Se você usar outras credenciais, vai receber mensagens de erro ou cobranças.

7. Aceite os termos e pule a página de recursos de recuperação.

Ative o Google Cloud Shell

O Google Cloud Shell é uma máquina virtual com ferramentas de desenvolvimento. Ele tem um diretório principal permanente de 5 GB e é executado no Google Cloud. O Google Cloud Shell oferece acesso de linha de comando aos seus recursos do GCP.

1. No Console do GCP, na barra de ferramentas superior direita, clique no botão Abrir o Cloud Shell.

   

2. Clique em Continue (continuar):

   

Aguarde alguns instantes para o provisionamento e a conexão com o ambiente. Quando você estiver conectado, já estará autenticado, e o projeto estará definido com seu PROJECT_ID. Por exemplo:

gcloud é a ferramenta de linha de comando do Google Cloud Platform. Ele vem pré-instalado no Cloud Shell e aceita preenchimento com tabulação.

É possível listar o nome da conta ativa com este comando:

gcloud auth list

Resposta:

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

Exemplo de resposta:

Credentialed accounts:
 - google1623327_student@qwiklabs.net

É possível listar o ID de projeto com este comando:

gcloud config list project

Resposta:

[core]
project = <project_ID>

Exemplo de resposta:

[core]
project = qwiklabs-gcp-44776a13dea667a6

Como preparar o aplicativo do estudo de caso

Nesta seção, você vai acessar o Cloud Shell, clonar o repositório git que contém o aplicativo Quiz, definir as variáveis de ambiente e executar o aplicativo.

Clone o código-fonte no Cloud Shell

1. Clone o repositório para este curso execute o comando abaixo:

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

2. Crie um link simbólico como um atalho no seu diretório de trabalho:

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

Configure e execute o aplicativo do estudo de caso

1. Mude para o diretório que contém os arquivos de exemplo do laboratório:

cd ~/stackdriver-debug-errorreporting/start

2. Para configurar o aplicativo de teste, execute o seguinte comando:

. prepare_incomplete_environment.sh

Como criar um repositório do Cloud Source Repositories

Nesta seção, você vai criar um repositório do Cloud Source Repositories e enviar o código do aplicativo Quiz laboratório para o novo repositório.

Crie um repositório do Cloud Source Repositories

1. No Menu de navegação do Console do Cloud Platform, clique em Source Repositories.
2. Selecione Adicionar repositório no canto superior direito.
3. Clique em Criar novo repositório e selecione Continuar.
4. Defina o nome do repositório como default e selecione o ID do projeto do GCP no menu suspenso do campo Projeto.
5. Clique em Criar.

A caixa de diálogo Adicionar código ao seu repositório é aberta.

Clone o repositório

1. Volte para a janela do Cloud Shell.

2. Para definir o diretório de trabalho novamente como a pasta inicial, execute o seguinte comando:

cd ~

3. Para clonar o repositório padrão do Cloud Source Repositories, execute este comando:

gcloud source repos clone default

4. Para copiar os arquivos do aplicativo Quiz que estão na pasta do laboratório para o repositório, execute este comando:

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

5. Altere o diretório de trabalho para default.

cd ~/default

6. Crie um arquivo .gitignore na pasta default para evitar a inclusão da pasta node_modules nos comandos git posteriores.

echo node_modules > .gitignore

7. Digite o comando git add para adicionar os arquivos que serão confirmados.

git add .

8. Digite os comandos para configurar o git com seu e-mail e nome.

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

9. Digite o comando git para commit as alterações com a mensagem "Quiz application initial check-in".

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

10. Digite o comando git push para adicionar as mudanças no repositório padrão.

git push

11. Volte à janela Repositório de origem e atualize a guia do navegador.

Como usar o Cloud Debugger

Nesta seção, você vai escrever o código para criar e iniciar o Cloud Debugger no aplicativo de teste, depois vai configurar snapshots e logpoints de depuração no Console do Cloud Platform.

Escreva o código para configurar o Cloud Debugger

1. No Cloud Shell, instale o agente do Node.js para o Cloud Debugger com este comando:

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

2. Clique em Abrir editor.

Se um erro indicar que não foi possível carregar o editor de código porque os cookies de terceiros estavam desativados, selecione Abrir em uma nova janela e mude para a nova guia.

3. No arquivo default/app.js, importe e inicie o módulo '@google-cloud/debug-agent'. Para mais informações, consulte: 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. Salve o arquivo.

Atualize o Cloud Source Repository e crie um contexto de origem

1. Volte para a janela do Cloud Shell.

Se o Cloud Shell não estiver visível, clique em Abrir terminal.

2. Adicione, confirme e envie alterações para o repositório padrão do Cloud Source Repositories usando os seguintes comandos:

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

3. Para produzir o arquivo de contexto da origem, execute o seguinte:

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

Depure o aplicativo da Web com um snapshot

1. Para instalar as dependências do aplicativo Quiz e iniciá-lo, execute este comando:

npm install
npm start

2. Quando o app estiver detectando na porta 8080, clique em Visualização na Web > Visualizar na porta 8080 para ver o aplicativo de teste.
3. Volte para o Console do Cloud Platform.
4. No Menu de navegação, clique em Depurador.

5. Use o navegador do código-fonte para selecionar o arquivo web-app/questions.js.
6. Encontre o gerenciador POST onde as perguntas são adicionadas (router.post('/add..)) e clique no número da linha no lado esquerdo da instrução em branco, logo após let data = req.body. Clique em Criar snapshot.

7. Volte para o aplicativo Quiz e clique em Create Question.
8. Preencha o formulário usando os valores a seguir e clique em Save.

Campo do formulário	Valor
Author	Your Name
Quiz	Google Cloud Platform
Title	Qual das opções abaixo é um produto do Google Cloud?
Answer 1	Debug
Answer 2	Error Reporting
Answer 3	Logging
Answer 4	Todas as anteriores (selecione Answer 4 como a resposta correta)

9. Volte à janela do Cloud Debug no Console do Cloud Platform.

10. Expanda a variável data.

Depure o aplicativo da Web com um logpoint

1. Ainda em questions.js, clique na guia Logpoint do painel à direita na janela Depuração.
2. Clique na mesma linha de código-fonte que você usou para inserir o snapshot e selecione Criar logpoint.

3. No editor interativo do logpoint, escreva o seguinte log statement e clique em Adicionar.

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

Esse log statement registra o valor do campo do formulário quiz.

4. Volte para o aplicativo de teste e clique em Create Question.
5. Preencha o formulário usando os valores a seguir e clique em Save.

Campo do formulário	Valor
Author	Your Name
Quiz	Google Cloud Platform
Title	Qual produto do Google Cloud inclui snapshots e logpoints?
Answer 1	Debugger (selecione Answer 1 como a resposta correta)
Answer 2	Error Reporting
Answer 3	Logging
Answer 4	Todas as anteriores

6. Volte para a janela do Cloud Shell.

Como usar o Cloud Error Reporting

Nesta seção, você escreverá o código para integrar o Cloud Error Reporting ao aplicativo Quiz. Além disso, você verá os erros no app da Web e no Cloud Functions.

Escreva o código para configurar o Cloud Error Reporting

1. No Cloud Shell, pressione Ctrl+C para interromper o aplicativo da Web.

2. Para instalar a biblioteca do Node.js para o Cloud Error Reporting, execute o seguinte comando:

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

3. No editor de código do Cloud Shell, navegue até default/app.js.

4. No arquivo app.js, carregue o módulo '@google-cloud/error-reporting.

5. Crie o cliente do 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. Configure o aplicativo para usar o Cloud Error Reporting com o Express.

default/app.js

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

7. Salve o arquivo.

Atualize o repositório do Cloud Source Repositories e crie um novo contexto de origem

1. Retorne à janela do Cloud Shell e execute os seguintes comandos para adicionar, confirmar e enviar as alterações para o Cloud Source Repository padrão:

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

2. Para criar o arquivo de contexto de origem, execute o seguinte:

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

Veja os erros do aplicativo da Web usando o Error Reporting

1. Por padrão, o Cloud Error Reporting fica ativo somente quando o aplicativo está em produção. Exporte uma variável de ambiente NODE_ENV definida com o valor production.

export NODE_ENV=production

2. Para iniciar o aplicativo, execute este comando:

npm start

3. Visualize o aplicativo da Web.
4. Volte para o Console do Cloud Platform.
5. Em Navigation menu, clique em Error Reporting.

6. Volte para o aplicativo de teste e clique em Take Test.
7. Clique em Places.
8. Termine o teste, adicione uma nota, escreva um feedback e clique em Send Feedback.

9. Volte para o Console do Cloud Platform.
10. Em Navigation menu, clique em Error Reporting.
11. Clique em Auto Reload.

Veja os erros de função do Cloud Functions usando o Error Reporting

1. Volte ao Cloud Shell e interrompa o aplicativo da Web pressionando Ctrl+C.

2. Para criar o tópico ausente do Pub/Sub, execute este comando:

gcloud pubsub topics create feedback

3. Para criar a função do Cloud Functions relacionada ao tópico de feedback e que insere um registro no Cloud Spanner, execute estes comandos:

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. Para iniciar o aplicativo da Web, execute este comando:

npm start

5. Visualize o aplicativo da Web.
6. Volte para o aplicativo de teste e clique em Take Test.
7. Clique em Places.
8. Termine o teste, adicione uma nota, escreva um feedback e clique em Send Feedback.

9. Volte para o Console do Cloud Platform.
10. Em Navigation menu, clique em Error Reporting.

11. Clique no link Error: ERROR processing feedback:.

12. Na seção Amostras recentes da janela, clique no link Ver registros para visualizar o erro do Cloud Functions.

13. Para criar o banco de dados e a tabela Feedback, volte ao Cloud Shell, interrompa o aplicativo da Web e execute este comando:

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);"

Bônus: como encontrar um erro de lógica no aplicativo Quiz

Nesta seção, você encontrará um erro no aplicativo Quiz e usará o Cloud Debugger para identificar a causa.

Reproduza o erro do aplicativo Quiz

1. Inicie o aplicativo da Web.
2. Navegue até a página inicial do aplicativo de teste e clique em Take Test.
3. Clique em Places.
4. Responda à pergunta corretamente.
5. Clique em GCP e selecione Places novamente.
6. Responda à pergunta incorretamente.
7. Qual pontuação aparece?

Finalize o laboratório

Clique em Terminar o laboratório após a conclusão. O Google Cloud Ensina remove os recursos usados e limpa a conta por você.

Você vai poder avaliar sua experiência no laboratório. Basta selecionar o número de estrelas, digitar um comentário e clicar em Enviar.

O número de estrelas indica o seguinte:

• 1 estrela = muito insatisfeito
• 2 estrelas = insatisfeito
• 3 estrelas = neutro
• 4 estrelas = satisfeito
• 5 estrelas = muito satisfeito

Feche a caixa de diálogo se não quiser enviar feedback.

Para enviar seu feedback, fazer sugestões ou correções, use a guia Suporte.

Copyright 2020 Google LLC. Todos os direitos reservados. Google e o logotipo do Google são marcas registradas da Google LLC. Todos os outros nomes de produtos e empresas podem ser marcas registradas das respectivas empresas a que estão associados.