Inicie sessão de um utilizador com um email através da Identity Platform

Saiba como usar a Identity Platform para iniciar sessão de um utilizador com um endereço de email e uma palavra-passe.


Para seguir orientações passo a passo para esta tarefa diretamente na Google Cloud consola, clique em Orientar-me:

Visita guiada


Antes de começar

  1. Sign in to your Google Cloud account. If you're new to Google Cloud, create an account to evaluate how our products perform in real-world scenarios. New customers also get $300 in free credits to run, test, and deploy workloads.
  2. In the Google Cloud console, on the project selector page, select or create a Google Cloud project.

    Roles required to select or create a project

    • Select a project: Selecting a project doesn't require a specific IAM role—you can select any project that you've been granted a role on.
    • Create a project: To create a project, you need the Project Creator (roles/resourcemanager.projectCreator), which contains the resourcemanager.projects.create permission. Learn how to grant roles.

    Go to project selector

  3. Verify that billing is enabled for your Google Cloud project.

  4. Make sure that you have the following role or roles on the project: Identity Platform Admin, Service Usage Admin

    Check for the roles

    1. In the Google Cloud console, go to the IAM page.

      Go to IAM
    2. Select the project.
    3. In the Principal column, find all rows that identify you or a group that you're included in. To learn which groups you're included in, contact your administrator.

    4. For all rows that specify or include you, check the Role column to see whether the list of roles includes the required roles.

    Grant the roles

    1. In the Google Cloud console, go to the IAM page.

      Aceder ao IAM
    2. Selecione o projeto.
    3. Clique em Conceder acesso.
    4. No campo Novos responsáveis, introduza o identificador do utilizador. Normalmente, este é o endereço de email de uma Conta Google.

    5. Na lista Selecionar uma função, selecione uma função.
    6. Para conceder funções adicionais, clique em Adicionar outra função e adicione cada função adicional.
    7. Clique em Guardar.
  5. In the Google Cloud console, on the project selector page, select or create a Google Cloud project.

    Roles required to select or create a project

    • Select a project: Selecting a project doesn't require a specific IAM role—you can select any project that you've been granted a role on.
    • Create a project: To create a project, you need the Project Creator (roles/resourcemanager.projectCreator), which contains the resourcemanager.projects.create permission. Learn how to grant roles.

    Go to project selector

  6. Verify that billing is enabled for your Google Cloud project.

  7. Make sure that you have the following role or roles on the project: Identity Platform Admin, Service Usage Admin

    Check for the roles

    1. In the Google Cloud console, go to the IAM page.

      Go to IAM
    2. Select the project.
    3. In the Principal column, find all rows that identify you or a group that you're included in. To learn which groups you're included in, contact your administrator.

    4. For all rows that specify or include you, check the Role column to see whether the list of roles includes the required roles.

    Grant the roles

    1. In the Google Cloud console, go to the IAM page.

      Aceder ao IAM
    2. Selecione o projeto.
    3. Clique em Conceder acesso.
    4. No campo Novos responsáveis, introduza o identificador do utilizador. Normalmente, este é o endereço de email de uma Conta Google.

    5. Na lista Selecionar uma função, selecione uma função.
    6. Para conceder funções adicionais, clique em Adicionar outra função e adicione cada função adicional.
    7. Clique em Guardar.
  8. Ative o Identity Platform

    1. Na Google Cloud consola, aceda à página Identity Platform no Cloud Marketplace.

      Aceda à Identity Platform

    2. Clique em Ativar Identity Platform.

    Configure um início de sessão por email

    1. Aceda à página Fornecedores de identidade.

      Aceder a Fornecedores de identidade

    2. Na página Fornecedores de identidade, clique em Adicionar um fornecedor.

    3. Na lista Selecionar um fornecedor, selecione Email/palavra-passe.

    4. Clique no botão Ativado para o ativar.

    5. Para guardar as definições do fornecedor, clique em Guardar.

    Crie um utilizador

    1. Na Google Cloud consola, aceda à página Utilizadores.

      Aceda a Utilizadores

    2. Clique em Adicionar utilizador.

    3. No campo Email, introduza um email e uma palavra-passe. Tome nota destes dois valores, pois vai precisar deles num passo posterior.

    4. Para adicionar o utilizador, clique em Adicionar. O novo utilizador é apresentado na página Utilizadores.

    Inicie sessão do utilizador

    Os passos para iniciar sessão no utilizador variam consoante a versão do SDK que a sua app está a usar. Certifique-se de que está a seguir os passos corretos para a sua aplicação.

    SDK v9 (modular)

    Instale o SDK e inicialize o Firebase

    A versão 9 do SDK JS do Firebase usa um formato de módulo JavaScript.

    Este fluxo de trabalho usa o npm e requer ferramentas de agrupamento de módulos ou frameworks de JavaScript porque o SDK v9 está otimizado para funcionar com agrupadores de módulos para eliminar código não usado (tree-shaking) e diminuir o tamanho do SDK.

    Para usar o SDK v9, siga estes passos:

    1. No diretório do projeto, instale o Firebase através do npm:

      npm install firebase
    2. Inicialize o Firebase na sua app e crie um objeto da app Firebase:

      import { initializeApp } from 'firebase/app';
      
      const firebaseConfig = {
          apiKey: "API_KEY",
          authDomain: "AUTH_DOMAIN"
      };
      
      const app = initializeApp(firebaseConfig);

      Substitua o seguinte:

      • API_KEY: o apiKey do seu projeto do Firebase.
      • AUTH_DOMAIN: o authDomain do seu projeto do Firebase.

      Pode encontrar estes valores na configuração do projeto do Firebase da sua app.

      Uma app Firebase é um objeto semelhante a um contentor que armazena a configuração comum e partilha a autenticação entre os serviços do Firebase. Depois de inicializar um objeto da app Firebase no seu código, pode adicionar e começar a usar os serviços do Firebase.

    Aceda ao Identity Platform no seu Javascript

    Agora que inicializou o SDK do Firebase, pode usá-lo em qualquer parte da sua app. Por exemplo, aqui está uma app que tenta iniciar sessão num utilizador codificado e apresentar o resultado numa página Web.

    import { initializeApp } from 'firebase/app';
    import {
      onAuthStateChanged,
      signInWithEmailAndPassword,
      getAuth
    } from 'firebase/auth';
    
    const firebaseConfig = {
      apiKey: "API_KEY",
      authDomain: "AUTH_DOMAIN"
    };
    const app = initializeApp(firebaseConfig);
    const auth = getAuth(app, {/* extra options */ });
    
    document.addEventListener("DOMContentLoaded", () => {
      onAuthStateChanged(auth, (user) => {
          if (user) {
              document.getElementById("message").innerHTML = "Welcome, " + user.email;
          }
          else {
              document.getElementById("message").innerHTML = "No user signed in.";
          }
      });
      signIn();
    });
    
    function signIn() {
      const email = "EMAIL_ID";
      const password = "PASSWORD";
      signInWithEmailAndPassword(auth, email, password)
          .catch((error) => {
              document.getElementById("message").innerHTML = error.message;
          });
    }
    

    Substitua o seguinte:

    • API_KEY: o apiKey do seu projeto do Firebase.
    • AUTH_DOMAIN: o authDomain do seu projeto do Firebase.
    • EMAIL_ID: o endereço de email do utilizador que criou anteriormente neste guia.
    • PASSWORD: a palavra-passe do utilizador que criou anteriormente neste guia.

    Use um agrupador de módulos para reduzir o tamanho

    O SDK para a Web do Firebase foi concebido para funcionar com agrupadores de módulos para remover qualquer código não utilizado (tree-shaking). Recomendamos vivamente a utilização desta abordagem para apps de produção. As ferramentas, como a CLI Angular, Next.js, Vue CLI> ou Create React App, processam automaticamente a união de módulos para bibliotecas instaladas através do npm e importadas para a sua base de código.

    Por exemplo, pode usar o Webpack para gerar uma pasta dist que contenha o código da aplicação e das dependências agrupadas. Consulte o artigo Usar agrupadores de módulos com o Firebase para mais informações.

    Importe o seu Javascript para a página

    1. Crie um novo ficheiro com o nome index.html.

    2. Adicione dois contentores HTML básicos e importe o js incluído.

      <script defer src="js/bundled.js"></script>
      <div>Identity Platform Quickstart</div>
      <div id="message">Loading...</div>
      
    3. Inicie o index.html no navegador de Internet. É apresentada uma mensagem de boas-vindas com o email do utilizador.

    SDK v8 (antigo)

    Crie uma página Web

    1. Na sua máquina local, crie um novo ficheiro denominado index.html.

    2. No ficheiro HTML, adicione dois contentores HTML:

      <div>Identity Platform Quickstart</div>
      <div id="message">Loading...</div>
      

    Inicialize o SDK de cliente da Identity Platform com a sua chave da API

    1. Na Google Cloud consola, aceda à página Fornecedores de identidade.

      Aceder a Fornecedores de identidade

    2. Clique em Detalhes de configuração da aplicação.

    3. Copie o código de inicialização para o index.html.

    Inicie sessão do utilizador

    1. Para iniciar sessão no utilizador, copie o seguinte código para index.html:

      <script>
        var email = "EMAIL_ID";
        var password = "PASSWORD";
      
        firebase.auth().onAuthStateChanged(function(user) {
          if (user) {
            document.getElementById("message").innerHTML = "Welcome, " + user.email;
          } else {
            document.getElementById("message").innerHTML = "No user signed in.";
          }
        });
      
        firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
          document.getElementById("message").innerHTML = error.message;
        });
      </script>
      

      Este código chama signInWithEmailAndPassword() e, em seguida, processa o resultado com o callback onAuthStateChanged().

      Substitua o seguinte:

      • EMAIL_ID: o email do utilizador que criou anteriormente
      • PASSWORD: a palavra-passe do utilizador que criou anteriormente
    2. Abra index.html no navegador de Internet. É apresentada uma mensagem de boas-vindas com o email do utilizador.

    Existe um limite para as tentativas de início de sessão de utilizador sem êxito. Várias tentativas de início de sessão rápidas e sem êxito bloqueiam temporariamente o utilizador na respetiva conta.

    Para mais informações sobre outros limites da Identity Platform, consulte o artigo Quotas e limites.

    Limpar

    Para evitar incorrer em cobranças na sua Google Cloud conta pelos recursos usados nesta página, siga estes passos.

    Elimine o fornecedor e o utilizador

    Se usou um Google Cloud projeto existente, elimine o fornecedor e o utilizador que criou para evitar incorrer em custos na sua conta:

    1. Na Google Cloud consola, aceda à página Fornecedores de identidade.

      Aceder a Fornecedores de identidade

    2. Para eliminar o fornecedor, clique em Eliminar junto ao nome do fornecedor. Para confirmar, clique em Eliminar.

    3. Na Google Cloud consola, aceda à página Utilizadores.

      Aceda a Utilizadores

    4. Para eliminar o utilizador que criou, clique em Eliminar junto ao nome do utilizador. Para confirmar, clique em Eliminar.

    Elimine o projeto

    A forma mais fácil de eliminar a faturação é eliminar o projeto que criou para o tutorial.

    Para eliminar o projeto:

    1. In the Google Cloud console, go to the Manage resources page.

      Go to Manage resources

    2. In the project list, select the project that you want to delete, and then click Delete.
    3. In the dialog, type the project ID, and then click Shut down to delete the project.

    O que se segue?

    Numa app real, os utilizadores inscrevem-se através de uma página de registo dedicada e, em seguida, iniciam sessão introduzindo os respetivos emails e palavras-passe. A Identity Platform oferece uma IU de autenticação pré-criada que pode usar para estas páginas ou pode criar a sua própria. Também pode querer suportar métodos de início de sessão adicionais, como fornecedores sociais (como o Facebook ou o Google), números de telefone, OIDC ou SAML.

    Saiba mais sobre o seguinte: