Autenticar usando SAML em apps da Web

Se você fez upgrade para o Firebase Authentication with Identity Platform, pode autenticar seus usuários com o Firebase usando o provedor de identidade SAML que preferir. Isso permite usar a solução de SSO baseada em SAML para fazer login de usuários no app Firebase.

Firebase Authentication dá suporte apenas ao fluxo SAML iniciado pelo provedor de serviços.

Antes de começar

Para fazer login de usuários usando um provedor de identidade SAML, colete algumas informações do provedor:

  • ID da entidade do provedor: um URI que identifica o provedor de identidade.
  • URL do SSO de SAML do provedor: o URL da página de login do provedor de identidade.
  • Certificado de chave pública do provedor: o certificado usado para validar os tokens assinados pelo provedor de identidade.
  • ID da entidade do app: um URI que identifica o app, o "provedor de serviços".

Depois de ter as informações acima, ative o SAML como um provedor de login do seu projeto do Firebase:

  1. Adicione o Firebase ao seu projeto em JavaScript.

  2. Se você não fez upgrade para o Firebase Authentication with Identity Platform, faça isso. A autenticação SAML está disponível apenas em projetos atualizados.

  3. Na página Provedores de login do console do Firebase, clique em Adicionar novo fornecedor e, em seguida, em SAML.

  4. Dê um nome a esse provedor. O ID do provedor gerado é algo como saml.example-provider. Você precisará desse ID ao adicionar o código de login ao seu app.

  5. Especifique o ID da entidade do provedor de identidade, o URL do SSO e o certificado de chave pública. Especifique também o ID da entidade do app (o provedor de serviços). Esses valores precisam ser iguais aos atribuídos pelo provedor.

  6. Salve as alterações.

  7. Se você ainda não autorizou o domínio do seu app, adicione-o à lista de permissões na página Autenticação > Configurações do console do Firebase.

Processe o fluxo de login com o SDK do Firebase

Para processar o fluxo de login com o SDK do Firebase para JavaScript, siga estas etapas:

  1. Crie uma instância de um SAMLAuthProvider usando o ID do provedor que você recebeu no Console do Firebase.

    Web

    import { SAMLAuthProvider } from "firebase/auth";
    
    const provider = new SAMLAuthProvider('saml.example-provider');
    

    Web

    var provider = new firebase.auth.SAMLAuthProvider('saml.example-provider');
    ``
    
  1. Faça a autenticação com o Firebase usando o objeto de provedor do SAML.

    Você pode redirecionar o usuário para a página de login do provedor ou abrir a página de login em uma janela pop-up do navegador.

    Fluxo de redirecionamento

    Redirecione para a página de login do provedor chamando signInWithRedirect():

    Web

    import { getAuth, signInWithRedirect } from "firebase/auth";
    
    const auth = getAuth();
    signInWithRedirect(auth, provider);
    

    Web

    firebase.auth().signInWithRedirect(provider);
    

    Depois que o usuário fizer login e retornar ao app, chame getRedirectResult() para ver o resultado do login.

    Web

    import { getAuth, getRedirectResult, SAMLAuthProvider } from "firebase/auth";
    
    const auth = getAuth();
    getRedirectResult(auth)
      .then((result) => {
        // User is signed in.
    
        // Provider data available using getAdditionalUserInfo()
      })
      .catch((error) => {
        // Handle error.
      });
    

    Web

    firebase.auth().getRedirectResult()
      .then((result) => {
        // User is signed in.
    
        // Provider data available in result.additionalUserInfo.profile,
        // or from the user's ID token obtained from result.user.getIdToken()
        // as an object in the firebase.sign_in_attributes custom claim.
      })
      .catch((error) => {
        // Handle error.
      });
    

    Fluxo pop-up

    Web

    import { getAuth, signInWithPopup, OAuthProvider } from "firebase/auth";
    
    const auth = getAuth();
    signInWithPopup(auth, provider)
      .then((result) => {
        // User is signed in.
    
        // Provider data available in result.additionalUserInfo.profile,
        // or from the user's ID token obtained from result.user.getIdToken()
        // as an object in the firebase.sign_in_attributes custom claim.
      })
      .catch((error) => {
        // Handle error.
      });
    

    Web

    firebase.auth().signInWithPopup(provider)
      .then((result) => {
        // User is signed in.
    
        // Provider data available in result.additionalUserInfo.profile,
        // or from the user's ID token obtained from result.user.getIdToken()
        // as an object in the firebase.sign_in_attributes custom claim.
      })
      .catch((error) => {
        // Handle error.
      });
    

    O token de ID e o objeto UserInfo conterão o endereço de e-mail do usuário apenas se ele for fornecido no atributo NameID da declaração SAML do provedor de identidade:

    <Subject>
      <NameID Format="urn:oasis:names:tc:SAML:1.1:nameid-format:emailAddress">test@email.com</NameID>
    </Subject>
    
  2. Os exemplos acima se concentram nos fluxos de login, mas é possível usar o mesmo padrão para vincular um provedor SAML a um usuário usando linkWithRedirect() e linkWithPopup(), além de autenticar novamente um usuário com reauthenticateWithRedirect() e reauthenticateWithPopup(), que podem ser usadas para recuperar credenciais novas de operações confidenciais que exigem um login recente.