Uwierzytelnianie przy użyciu SAML w aplikacjach internetowych

Jeśli masz uaktualnioną usługę Firebase Authentication with Identity Platform, możesz uwierzytelniać użytkowników w Firebase za pomocą wybranego dostawcy tożsamości SAML. Dzięki temu możesz używać rozwiązania SSO opartego na SAML do logowania użytkowników w aplikacji w Firebase.

Firebase Authentication obsługuje tylko przepływ SAML inicjowany przez dostawcę usługi.

Zanim zaczniesz

Aby logować użytkowników za pomocą dostawcy tożsamości SAML, musisz najpierw zebrać od niego te informacje:

  • Identyfikator jednostki dostawcy: identyfikator URI, który identyfikuje dostawcę tożsamości.
  • URL logowania jednokrotnego SAML dostawcy: adres URL strony logowania dostawcy tożsamości.
  • Certyfikat klucza publicznego dostawcy: certyfikat używany do weryfikowania tokenów podpisanych przez dostawcę tożsamości.
  • Identyfikator jednostki aplikacji: identyfikator URI, który identyfikuje Twoją aplikację, czyli „dostawcę usługi”.

Gdy uzyskasz te informacje, włącz SAML jako dostawcę logowania w projekcie w Firebase:

  1. Dodaj Firebase do projektu JavaScript.

  2. Jeśli nie masz uaktualnionej usługi Firebase Authentication with Identity Platform, zrób to. Uwierzytelnianie SAML jest tylko dostępne w uaktualnionych projektach.

  3. Na stronie Dostawcy logowania w konsoli Firebase kliknij Dodaj nowego dostawcę, a potem SAML.

  4. Nadaj nazwę temu dostawcy. Zanotuj wygenerowany identyfikator dostawcy, np. saml.example-provider. Będzie on potrzebny, gdy dodasz do aplikacji kod logowania.

  5. Określ identyfikator jednostki, adres URL logowania jednokrotnego i certyfikat klucza publicznego dostawcy tożsamości. Określ też identyfikator jednostki aplikacji (dostawcy usługi). Te wartości muszą dokładnie odpowiadać wartościom przypisanym przez dostawcę.

  6. Zapisz zmiany.

  7. Jeśli nie masz jeszcze autoryzowanej domeny aplikacji, dodaj ją do listy dozwolonych na stronie Authentication > Ustawienia konsoli Firebase.

Obsługa przepływu logowania za pomocą pakietu Firebase SDK

Aby obsługiwać przepływ logowania za pomocą pakietu Firebase JavaScript SDK, wykonaj te czynności:

  1. Utwórz instancję SAMLAuthProvider, używając identyfikatora dostawcy uzyskanego w konsoli 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. Uwierzytelnij się w Firebase za pomocą obiektu dostawcy SAML.

    Możesz przekierować użytkownika na stronę logowania dostawcy lub otworzyć ją w wyskakującym oknie przeglądarki.

    Przepływ przekierowania

    Przekieruj na stronę logowania dostawcy, wywołując signInWithRedirect():

    Web

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

    Web

    firebase.auth().signInWithRedirect(provider);
    

    Gdy użytkownik zakończy logowanie i wróci do aplikacji, możesz uzyskać wynik logowania, wywołując getRedirectResult().

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

    Przepływ wyskakującego okienka

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

    Token identyfikatora i obiekt UserInfo zawierają adres e-mail użytkownika tylko wtedy, gdy jest on podany w atrybucie NameID potwierdzenia SAML od dostawcy tożsamości:

    <Subject>
      <NameID Format="urn:oasis:names:tc:SAML:1.1:nameid-format:emailAddress">test@email.com</NameID>
    </Subject>
    
  2. Powyższe przykłady koncentrują się na przepływach logowania, ale możesz użyć tego samego wzorca, aby połączyć dostawcę SAML z istniejącym użytkownikiem za pomocą linkWithRedirect() i linkWithPopup() oraz ponownie uwierzytelnić użytkownika za pomocą reauthenticateWithRedirect() i reauthenticateWithPopup(), których można użyć do pobrania nowych danych logowania do operacji wymagających niedawnego logowania.