Autenticar usando SAML em aplicativos da web

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

O Firebase Authentication é compatível apenas com o fluxo SAML iniciado pelo provedor de serviços.

Antes de você começar

Para fazer login de usuários usando um provedor de identidade SAML, você deve primeiro coletar algumas informações do provedor:

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

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

1. Adicione o Firebase ao seu projeto JavaScript .

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

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

4. Dê um nome a este provedor. Observe o ID do provedor gerado: algo como saml.example-provider . Você precisará desse ID ao adicionar o código de login ao seu aplicativo.

5. Especifique o ID da entidade do seu provedor de identidade, URL de SSO e certificado de chave pública. Especifique também o ID da entidade do seu aplicativo (o provedor de serviços). Esses valores devem corresponder exatamente aos valores que seu provedor atribuiu a você.

6. Salve suas alterações.

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

Gerencie o fluxo de login com o SDK do Firebase

Para lidar com 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ê obteve no console do Firebase.

   Web version 9

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

   Web version 8

   var provider = new firebase.auth.SAMLAuthProvider('saml.example-provider');
   ``
   

1. Autentique-se com o Firebase usando o objeto do provedor 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.

   Redirecionar fluxo

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

   Web version 9

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

   Web version 8

   firebase.auth().signInWithRedirect(provider);
   

   Depois que o usuário concluir o login e retornar ao seu aplicativo, você poderá obter o resultado do login chamando getRedirectResult() .

   Web version 9

   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 version 8

   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 de pop-up

   Web version 9

   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 version 8

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

2. Embora os exemplos acima se concentrem em fluxos de login, você pode usar o mesmo padrão para vincular um provedor SAML a um usuário existente usando linkWithRedirect() e linkWithPopup() e reauthenticateWithRedirect() um usuário com reauthenticateWithRedirect() e reauthenticateWithPopup( reauthenticateWithPopup() , que pode ser usado para recuperar novas credenciais para operações confidenciais que exigem login recente.