Autenticati utilizzando SAML nelle app Web

Se hai eseguito l'upgrade all'autenticazione Firebase con Identity Platform, puoi autenticare i tuoi utenti con Firebase utilizzando il provider di identità SAML di tua scelta. Ciò rende possibile utilizzare la tua soluzione SSO basata su SAML per far accedere gli utenti alla tua app Firebase.

L'autenticazione Firebase supporta solo il flusso SAML avviato dal provider di servizi.

Prima di iniziare

Per accedere agli utenti utilizzando un provider di identità SAML, devi prima raccogliere alcune informazioni dal provider:

• L'ID entità del provider : un URI che identifica il provider di identità.
• URL SSO SAML del provider : l'URL della pagina di accesso del provider di identità.
• Il certificato di chiave pubblica del provider : il certificato utilizzato per convalidare i token firmati dal provider di identità.
• L'ID entità della tua app : un URI che identifica la tua app, il "fornitore di servizi".

Dopo aver ottenuto le informazioni di cui sopra, abilita SAML come provider di accesso per il tuo progetto Firebase:

1. Aggiungi Firebase al tuo progetto JavaScript .

2. Se non hai eseguito l'aggiornamento all'autenticazione Firebase con Identity Platform, fallo. L'autenticazione SAML è disponibile solo nei progetti aggiornati.

3. Nella pagina Provider di accesso della console Firebase, fai clic su Aggiungi nuovo provider e quindi su SAML .

4. Dai un nome a questo fornitore. Prendi nota dell'ID provider generato: qualcosa come saml.example-provider . Avrai bisogno di questo ID quando aggiungerai il codice di accesso alla tua app.

5. Specifica l'ID entità del tuo provider di identità, l'URL SSO e il certificato di chiave pubblica. Specifica anche l'ID entità della tua app (il fornitore di servizi). Questi valori devono corrispondere esattamente ai valori assegnati dal tuo provider.

6. Salva le modifiche.

7. Se non hai già autorizzato il dominio della tua app, aggiungilo all'elenco di autorizzazioni nella pagina Autenticazione > Impostazioni della console Firebase.

Gestisci il flusso di accesso con l'SDK Firebase

Per gestire il flusso di accesso con l'SDK JavaScript di Firebase, procedi nel seguente modo:

1. Crea un'istanza di SAMLAuthProvider utilizzando l'ID provider ottenuto nella console Firebase.

   API modulare Web

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

   API con spazio dei nomi Web

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

1. Esegui l'autenticazione con Firebase utilizzando l'oggetto provider SAML.

   Puoi reindirizzare l'utente alla pagina di accesso del provider o aprire la pagina di accesso in una finestra popup del browser.

   Reindirizzare il flusso

   Reindirizzamento alla pagina di accesso del provider chiamando signInWithRedirect() :

   API modulare Web

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

   API con spazio dei nomi Web

   firebase.auth().signInWithRedirect(provider);
   

   Dopo che l'utente ha completato l'accesso ed è tornato alla tua app, puoi ottenere il risultato dell'accesso chiamando getRedirectResult() .

   API modulare 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 con spazio dei nomi 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.
     });
   

   Flusso pop-up

   API modulare 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 con spazio dei nomi 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.
     });
   

   Il token ID e l'oggetto UserInfo contengono l'indirizzo email dell'utente solo se viene fornito nell'attributo NameID dell'asserzione SAML dal provider di identità:

   <Subject>
     <NameID Format="urn:oasis:names:tc:SAML:1.1:nameid-format:emailAddress">test@email.com</NameID>
   </Subject>
   

2. Sebbene gli esempi precedenti si concentrino sui flussi di accesso, puoi utilizzare lo stesso modello per collegare un provider SAML a un utente esistente utilizzando linkWithRedirect() e linkWithPopup() e ri-autenticare un utente con reauthenticateWithRedirect() e reauthenticateWithPopup() , che può essere utilizzato per recuperare nuove credenziali per operazioni sensibili che richiedono un accesso recente.