Informações gerais

Este laboratório mostra como adicionar autenticação ao seu aplicativo usando o Identity Platform. Essa autorização identifica quem você é e determina suas permissões. Para saber mais, consulte as Informações gerais sobre autenticação.

O Identity Platform oferece um serviço de autenticação simples e personalizável para inscrição e login do usuário. As atividades de desenvolvimento e administração se tornam mais fáceis devido à variedade de SDKs de aplicativos (Android, iOS e Web), além de SDKs Admin (Node.js, Java, Python e mais). Para saber mais sobre o Identity Platform, consulte Identity Platform.

Neste laboratório, utilizamos um aplicativo de teste on-line. Você vai adicionar a autenticação do Identity Platform e configurá-la para usar uma credencial com uma senha e um endereço de e-mail simples. Assim, os usuários precisam se registrar e fazer login antes do teste.

Objetivos

Neste laboratório, você vai executar as seguintes tarefas:

• Adicionar a configuração do Identity Platform a um aplicativo da Web no lado do cliente
• Criar um código Python para integrar a autenticação do Identity Platform a um aplicativo da Web no lado do cliente

Configuração e requisitos

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

1. Faça login no Qwiklabs usando uma janela anônima do navegador.

2. Controle a duração do laboratório (por exemplo, ) para concluí-lo no tempo determinado.

3. Quando puder começar, clique em .

4. Anote suas credenciais do laboratório. É com elas que você fará login no Console do Google Cloud.

5. Clique em Abrir Console do Google.

6. Clique em Usar outra conta e copie e cole as credenciais deste laboratório nos locais indicados.

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 Cloud Shell oferece acesso de linha de comando aos recursos do Google Cloud.

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

   

2. Clique em Continuar.

O provisionamento e a conexão do ambiente podem demorar um pouco. Quando você estiver conectado, já estará autenticado, e o projeto estará definido com seu PROJECT_ID. Exemplo:

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

• Para listar o nome da conta ativa, use este comando:

Saída:

Exemplo de saída:

• Para listar o ID do projeto, use este comando:

Saída:

Exemplo de saída:

Tarefa 1: Preparar o aplicativo do estudo de caso

Nesta tarefa, você vai clonar, configurar e executar o aplicativo de teste.

Clone o código-fonte no Cloud Shell

1. Clone o esqueleto do aplicativo de um repositório do GitHub.com:

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

2. Crie um link flexível como atalho para o diretório de trabalho:

   ln -s ~/training-data-analyst/courses/developingapps/v1.3/python/firebase ~/firebase

Configure e execute o aplicativo de estudo de caso

1. Acesse o diretório que contém os arquivos de amostra deste laboratório:

   cd ~/firebase/start

2. Configure o aplicativo:

   . prepare_environment.sh

   Esse arquivo de script:

   • Cria um aplicativo do App Engine
   • Cria um bucket do Cloud Storage chamado gs:[Project-ID]-media.
   • Exporta as variáveis de ambiente: GCLOUD_PROJECT e GCLOUD_BUCKET.
   • Cria um ambiente isolado virtualenv do Python 3 e o ativa.
   • Executa > pip install -r requirements.txt.
   • Cria entidades no Cloud Datastore.
   • Imprime o ID do projeto do Google Cloud Platform

3. Execute o aplicativo:

   python run_server.py

Inicie o aplicativo do estudo de caso

• No Cloud Shell, clique em Visualização na Web () > Visualizar na porta 8080 para exibir o aplicativo de teste.

Deixe essa janela aberta por enquanto, porque mais tarde você vai precisar do domínio de visualização da Web do Cloud Shell, que está no formato 8080-27542cac-44d0-41a9-9e96-065800c2100c.ql-europe-west1-ctgq.cloudshell.dev.

Tarefa 2: Examine o código do aplicativo do estudo de caso

Nesta tarefa, você vai analisar o código do aplicativo do estudo de caso. Você pode usar os editores de shell instalados no Cloud Shell, como nano ou vim, ou usar o editor de código do Cloud Shell.

Este laboratório usará o editor de código do Cloud Shell para revisar o código do aplicativo de teste.

Inicie o editor de código do Cloud Shell

• No Cloud Shell, clique em Abrir editor para iniciar o editor de código.

Analise o aplicativo cliente

1. Acesse a pasta firebase/start usando o painel do navegador de arquivos do lado esquerdo do editor de código.

2. Continue a navegação. Abra ...quiz/webapp/static/client/. Clique no arquivo index.html.

   Esse arquivo é a única página do aplicativo de página única (SPA) do AngularJS. Ele contém tags <script></script> das bibliotecas e do código do aplicativo, além da marcação do local onde o SPA renderizará a saída dinâmica.

3. Selecione o arquivo qiq-login-template.html da pasta ...quiz/webapp/static/client/app/auth/.

   Esse arquivo contém o modelo AngularJS para o componente Login. Observe que ele contém algumas caixas de texto e um botão. O botão tem um manipulador de eventos que executa o código quando é clicado.

4. Ainda nessa pasta, selecione o arquivo qiq-login.js.

   Esse arquivo contém um componente do AngularJS. Ele permite que o usuário faça login no aplicativo ou acesse uma página de registro.

Tarefa 3. Configure a autenticação do Identity Platform

Nesta tarefa, você vai confirmar que o faturamento está ativado no seu projeto do Cloud. Em seguida, vai configurar o Identity Platform para fazer o login de um usuário usando e-mail e senha. Por fim, você vai criar um usuário para fazer login no aplicativo de teste.

Confirmar a ativação do faturamento

1. No Menu de navegação () do console do Google Cloud, clique em Faturamento.

2. Verifique se a conta de faturamento está vinculada ao projeto. Você deve ver uma mensagem informando que a conta de faturamento "Qwiklabs Production gcpd xx" está vinculada ao projeto.

Configurar o login do Identity Platform para solicitar e-mail e senha

1. No Menu de navegação () do console do Google Cloud, clique em Identity Platform.

2. Clique em Ativar Identity Platform.

   Observação: se a mensagem de pop-up "Sair do site" for exibida, clique em Sair.

   A página do Identity Platform aparece no console do Cloud.

   

3. Clique em Adicionar um provedor.

4. Na janela "Método de login", em Selecionar um provedor, clique em E-mail/senha.

5. Clique em Ativado.

6. No painel "Domínios autorizados", clique em Adicionar domínio.

7. Volte para o aplicativo de teste em execução e copie o domínio, que tem o formato 8080-27542cac-44d0-41a9-9e96-065800c2100c.ql-europe-west1-ctgq.cloudshell.dev.

8. Cole o domínio no campo Domain.

9. Modifique o domínio colado para que apenas o nome de domínio fique no campo “Domínio”.

   Remova https:// e tudo o que segue o nome de domínio, incluindo barras. O nome de domínio deve terminar com cloudshell.dev.

10. Clique em Salvar.

11. Na janela do provedor de identidade, clique em Salvar.

    Talvez seja necessário rolar a tela para baixo para ver o botão "Salvar".

Adicionar um usuário

1. No painel do Identity Platform, clique em Usuários.

2. Clique em Adicionar usuário.

3. Na caixa de diálogo "Adicionar usuário", especifique as seguintes informações:

   E-mail	user1@example.com
   Senha	abc123!

4. Clique em Adicionar.

Tarefa 4: Integrar o Identity Platform a um aplicativo da Web do lado do cliente

Nesta tarefa, você vai aplicar a configuração do Identity Platform ao seu aplicativo da Web do lado do cliente.

1. No painel de navegação, clique em Provedores.

2. Clique em Detalhes da configuração do aplicativo.

3. Na caixa de diálogo "Configurar seu aplicativo", copie a marcação do Identity Platform.

   

4. Clique em Fechar.

5. No editor de código do Cloud Shell, abra o arquivo index.html em ...webapp/static/client/.

6. Cole a marcação de configuração logo antes das outras tags <script></script> da parte inferior da página.

7. Salve o arquivo index.html.

Tarefa 5: Execute o aplicativo

Nesta tarefa, você vai verificar se pode fazer login no aplicativo de teste usando as credenciais criadas no Identity Platform na etapa anterior. Depois, vai registrar um novo usuário no aplicativo de teste e verificar se essas credenciais foram adicionadas ao Identity Platform.

1. Retorne ao aplicativo de teste e atualize o navegador.

2. Na barra de navegação, clique em Fazer o teste.

   

3. Na barra de navegação, clique em GCP, Pessoas ou Lugares.

   Observação: para fazer um teste, é necessário fazer login primeiro.

4. Na barra de navegação, insira as seguintes credenciais inválidas:

   E-mail	user2@example.com
   Senha	abcd1234$

5. Clique em Login.

   Observação: a tentativa de login vai falhar porque o usuário não tem registro.

6. Insira as seguintes credenciais que você criou em uma tarefa anterior:

   E-mail	user1@example.com
   Senha	abc123!

7. Clique em Login.

   O endereço de e-mail do usuário deve aparecer na barra de navegação, e a primeira pergunta é apresentada.

   Observação: se o login não funcionar, a senha pode não ter sido configurada corretamente. Volte para a página "Usuários" no Identity Platform e exclua e adicione novamente com a senha correta o usuario1@exemplo.com.

8. Na barra de navegação, clique em Logout.

9. Clique no link Registrar.

10. No formulário novo, insira as seguintes credenciais:

    E-mail	user2@example.com
    Senha	abcd1234$

11. Clique em Registrar.

    É necessário uma senha mais complexa. Se você inseriu uma senha aceitável, vai se conectar e ter o acesso redirecionado para o teste do GCP.

    Depois disso, já vai ser possível responder às perguntas.

12. Na barra de navegação, clique em Logout.

    Observação: você vai sair da sessão e ter o acesso redirecionado para a página inicial do teste.

13. No console do Google Cloud, no painel de navegação do Identity Platform, clique em Usuários.

    Observação: você vai ver que usuario2@exemplo.com foi adicionado como um usuário.

Parabéns!

Neste laboratório, você aprendeu a usar o Identity Platform para ativar o registro por e-mail e senha no seu aplicativo.

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 2026 Google LLC. Todos os direitos reservados. Google e o logotipo do Google são marcas registradas da Google LLC. Todos os outros nomes de empresas e produtos podem ser marcas registradas das empresas a que estão associados.