Como fazer login de usuários com OIDC

Este documento mostra como usar o Identity Platform para fazer login de usuários com um provedor OpenID Connect (OIDC).

Antes de começar

  1. Faça login na sua conta do Google Cloud. Se você começou a usar o Google Cloud agora, crie uma conta para avaliar o desempenho de nossos produtos em situações reais. Clientes novos também recebem US$ 300 em créditos para executar, testar e implantar cargas de trabalho.
  2. No Console do Google Cloud, na página do seletor de projetos, selecione ou crie um projeto do Google Cloud.

    Acessar o seletor de projetos

  3. Verifique se o faturamento está ativado para seu projeto na nuvem. Saiba como confirmar se o faturamento está ativado para o projeto.

  4. No Console do Google Cloud, na página do seletor de projetos, selecione ou crie um projeto do Google Cloud.

    Acessar o seletor de projetos

  5. Verifique se o faturamento está ativado para seu projeto na nuvem. Saiba como confirmar se o faturamento está ativado para o projeto.

  6. Ative o Identity Platform e adicione o SDK do cliente ao seu app. Veja o Guia de início rápido para saber como.

Como configurar o provedor

  1. Acesse a página Provedores do Identity Platform no Console do Cloud.
    Acessar a página "Provedores do Identity Platform"

  2. Clique em Adicionar um provedor e selecione OpenID Connect na lista.

Fluxo do código de autorização

  1. Insira os seguintes detalhes para ativar o fluxo de código de autorização:

    1. Selecione Fluxo de código na seção Escolher tipo de concessão.

    2. O Nome do provedor. Ele pode ser igual ao ID do provedor ou um nome personalizado. Se você inserir um nome personalizado, clique em Editar ao lado de ID do provedor para especificar o ID (que precisa começar com oidc.).

    3. O ID do cliente do provedor.

    4. O Emissor do provedor. Ele será semelhante a https://example.com. O Identity Platform usa esse URL para localizar o documento de descoberta do OIDC (normalmente encontrado em /.well-known/openid-configuration), que especifica os endpoints e as chaves públicas do OAuth do provedor.

    5. A chave secreta do cliente do provedor.

  2. Adicione seu app à lista de Domínios autorizados. Por exemplo, se o URL de login do seu aplicativo for https://example.com/login, adicione example.com.

  3. Configure o URL de callback do Identity Platform como um URL de redirecionamento com seu provedor OIDC. O URL precisa ser semelhante a https://[PROJECT-ID].firebaseapp.com/__/auth/handler.

  4. Clique em Save.

Fluxo implícito

  1. Insira os seguintes detalhes para ativar o fluxo implícito:

    1. Selecione Fluxo implícito na seção Escolher tipo de concessão.

    2. O Nome do provedor. Ele pode ser igual ao ID do provedor ou um nome personalizado. Se você inserir um nome personalizado, clique em Editar ao lado de ID do provedor para especificar o ID (que precisa começar com oidc.).

    3. O ID do cliente do provedor.

    4. O Emissor do provedor. Isso precisa ser parecido como https://example.com.. O Identity Platform usa esse URL para localizar o documento de descoberta do OIDC, normalmente encontrado em /.well-known/openid-configuration, que especifica os endpoints OAuth do provedor e as chaves públicas.

  2. Adicione seu app à lista de Domínios autorizados. Por exemplo, se o URL de login do seu aplicativo for https://example.com/login, adicione example.com.

  3. Configure o URL de callback do Identity Platform como um URL de redirecionamento com seu provedor OIDC. O URL precisa ser semelhante a https://[PROJECT-ID].firebaseapp.com/__/auth/handler.

  4. Clique em Save.

Como conectar usuários

Há duas maneiras de fazer login dos usuários com o OIDC:

  • Usando fluxo de OAuth. Essa abordagem conclui o handshake do OAuth para você. Com base na seleção de fluxo de código de autorização/fluxo implícito na etapa da configuração do provedor, o servidor GCIP escolhe o fluxo desejado para se comunicar com o provedor de identidade.

  • Usar o token de ID do provedor OIDC. Esse método presume que você já tem um token OIDC disponível.

Como fazer login dos usuários com o OAuth

Para fazer login usando o OAuth:

  1. Crie uma instância OAuthProvider com o ID do provedor configurado na seção anterior. O ID do provedor precisa começar com oidc..

    const provider = new firebase.auth.OAuthProvider('oidc.myProvider');
    
  2. Inicie o fluxo de login. É possível usar um pop-up ou um redirecionamento.

    Para mostrar um pop-up, chame signInWithPopup():

    firebase.auth().signInWithPopup(provider)
      .then((result) => {
        // result.credential is a firebase.auth.OAuthCredential object.
        // result.credential.providerId is equal to 'oidc.myProvider'.
        // result.credential.idToken is the OIDC provider's ID token.
      })
      .catch((error) => {
        // Handle error.
      });
    

    Redirect

    Para redirecionar para uma página de login, chame signInWithRedirect():

    firebase.auth().signInWithRedirect(provider)
      .catch((error) => {
        // Handle error.
      });
    

    Em seguida, chame getRedirectResult() para ver os resultados quando o usuário retornar ao app:

    // On return.
    firebase.auth().getRedirectResult()
      .then((result) => {
        // result.credential is a firebase.auth.OAuthCredential object.
        // result.credential.providerId is equal to 'oidc.myProvider'.
        // result.credential.idToken is the OIDC provider's ID token.
      })
      .catch((error) => {
        // Handle error.
      });
    

Ao concluir um dos fluxos, é possível conseguir o token de ID do OIDC usando o campo result.credential.idToken.

Como fazer login de usuários diretamente

Para fazer login de um usuário com um token de ID OIDC diretamente:

  1. Inicialize uma instância OAuthProvider com o ID do provedor configurado na seção anterior. O ID do provedor precisa começar com oidc.. Em seguida, crie um OAuthCredential:

    const provider = new firebase.auth.OAuthProvider('oidc.myProvider');
    const credential = provider.credential(oidcIdToken, null);
    
  2. Chame signInWithCredential() para fazer login do usuário:

    firebase.auth().signInWithCredential(credential)
      .then((result) => {
        // user now has a odic.myProvider UserInfo in providerData.
      })
      .catch((error) => {
        // Handle error.
      });
    

Como vincular contas de usuário

Se um usuário já tiver feito login em seu aplicativo usando um método diferente (como e-mail/senha), você poderá vincular a conta atual ao provedor OIDC usando linkWithPopup() ou linkWithRedirect(). Exemplo:

const provider = new firebase.auth.OAuthProvider('oidc.myProvider');

// Link with a popup.
firebase.auth().currentUser.linkWithPopup(provider)
    // currentUser.providerData now has an additional entry for this provider.
  }).catch((error) => {
    // Handle error.
  });

Como autenticar novamente usuários

Determinadas operações confidenciais, como atualizar o e-mail ou a senha de um usuário, exigem que o usuário tenha feito login recentemente. Para fazer login novamente, chame reauthenticateWithPopup() ou reauthenticateWithRedirect(). Exemplo:

const provider = new firebase.auth.OAuthProvider('oidc.myProvider');

// Reauthenticate with a popup.
firebase.auth().currentUser.reauthenticateWithPopup(provider)
  .then((result) => {
    // Get the updated ID token.
    return result.user.getIdTokenResult();
  })
  .then((idTokenResult) => {
    // idTokenResult.authTime should be updated to reflect recent sign-in status.
    // idTokenResult.token has the latest ID token.
  })
  .catch((error) => {
    // Handle error.
  });

A seguir