Visão geral

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 o Documento sobre a Autenticação no Google.

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 apps (Android, iOS e Web), além de SDKs Admin (Node.js, Java, Python e mais). Para mais informações sobre o Identity Platform, consulte este link.

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 JavaScript 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 repositório para este curso usando o comando abaixo:

2. Crie um link flexível para os arquivos de trabalho:

Configure e execute o aplicativo de estudo de caso

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

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

3. Para iniciar o aplicativo, execute o seguinte comando:

Inicie o aplicativo do estudo de caso

• No Cloud Shell, clique em Visualização na Web () > Visualizar na porta 8080 para ver 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: Examinar o código do aplicativo para o estudo de caso

Nesta seção, você usará o editor de texto do Cloud Shell para analisar o código do aplicativo de estudo de caso.

Inicie o editor do Cloud Shell

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

Analise o aplicativo cliente

1. Selecione o arquivo index.html na pasta firebase/start/server/public/client/.

2. Selecione o arquivo qiq-login-template.html na pasta firebase/start/server/public/client/app/auth/.

3. Selecione o arquivo qiq-login.js.

Tarefa 3: Configurar 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

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

  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 console do Google Cloud, acesse o Menu de navegação () e clique em Identity Platform.

2. Clique em Ativar Identity Platform.

   Observação: se você ver a mensagem de pop-up "Sair do site", 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. Clique em Salvar.

9. 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. Volte para o editor de código do Cloud Shell e abra firebase/start/server/public/client/index.html.

6. Cole a marcação copiada do script de configuração do Identity Manager nas linhas em branco antes da série de linhas <script></script> na parte de baixo do arquivo.

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. 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.