Autenticar usando SAML em apps da Web

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

O Firebase Authentication só oferece suporte 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 com o 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, clique 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 mudanças.

  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.

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

    API modular da Web

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

    API com namespace da 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():

    API modular da Web

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

    API com namespace da Web

    firebase.auth().signInWithRedirect(provider);
    

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

    API modular da 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.
      });
    

    API com namespace da 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

    API modular da 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.
      });
    

    API com namespace da 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.