Autenticar usando SAML en aplicaciones web

Si actualizó a Firebase Authentication con Identity Platform, puede autenticar a sus usuarios con Firebase utilizando el proveedor de identidad SAML de su elección. Esto hace posible utilizar su solución SSO basada en SAML para iniciar sesión en su aplicación Firebase.

Firebase Authentication solo admite el flujo SAML iniciado por el proveedor de servicios.

Antes de que empieces

Para iniciar sesión como usuario utilizando un proveedor de identidad SAML, primero debe recopilar cierta información del proveedor:

  • ID de entidad del proveedor : un URI que identifica al proveedor de identidad.
  • URL de SSO SAML del proveedor : la URL de la página de inicio de sesión del proveedor de identidad.
  • El certificado de clave pública del proveedor : el certificado utilizado para validar los tokens firmados por el proveedor de identidad.
  • El ID de entidad de su aplicación : un URI que identifica su aplicación, el "proveedor de servicios".

Una vez que tenga la información anterior, habilite SAML como proveedor de inicio de sesión para su proyecto de Firebase:

  1. Agrega Firebase a tu proyecto de JavaScript .

  2. Si no has actualizado a Firebase Authentication con Identity Platform, hazlo. La autenticación SAML solo está disponible en proyectos actualizados.

  3. En la página Proveedores de inicio de sesión de Firebase console, haga clic en Agregar nuevo proveedor y luego haga clic en SAML .

  4. Dé un nombre a este proveedor. Tenga en cuenta el ID del proveedor que se genera: algo así como saml.example-provider . Necesitará esta identificación cuando agregue el código de inicio de sesión a su aplicación.

  5. Especifique el ID de entidad de su proveedor de identidad, la URL de SSO y el certificado de clave pública. Especifique también el ID de entidad de su aplicación (el proveedor de servicios). Estos valores deben coincidir exactamente con los valores que le asignó su proveedor.

  6. Guarde sus cambios.

  7. Si aún no ha autorizado el dominio de su aplicación, agréguelo a la lista de permitidos en la página Autenticación > Configuración de Firebase console.

Maneja el flujo de inicio de sesión con el SDK de Firebase

Para manejar el flujo de inicio de sesión con el SDK de JavaScript de Firebase, sigue estos pasos:

  1. Cree una instancia de SAMLAuthProvider utilizando el ID de proveedor que obtuvo en Firebase console.

    API modular web

    import { SAMLAuthProvider } from "firebase/auth";

const provider = new SAMLAuthProvider('saml.example-provider');

    API con espacio de nombres web

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

  1. Autenticarse con Firebase utilizando el objeto proveedor SAML.

    Puede redirigir al usuario a la página de inicio de sesión del proveedor o abrir la página de inicio de sesión en una ventana emergente del navegador.

    Redirigir flujo

    Redirija a la página de inicio de sesión del proveedor llamando signInWithRedirect() :

    API modular web

    import { getAuth, signInWithRedirect } from "firebase/auth";

const auth = getAuth();
signInWithRedirect(auth, provider);

    API con espacio de nombres web

    firebase.auth().signInWithRedirect(provider);

    Después de que el usuario complete el inicio de sesión y regrese a su aplicación, puede obtener el resultado del inicio de sesión llamando a getRedirectResult() .

    API modular 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 espacio de nombres 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.
  });

    flujo emergente

    API modular 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 espacio de nombres 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.
  });

    El token de ID y el objeto UserInfo contienen la dirección de correo electrónico del usuario solo si se proporciona en el atributo NameID de la aserción SAML del proveedor de identidad:

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

  2. Si bien los ejemplos anteriores se centran en los flujos de inicio de sesión, puede usar el mismo patrón para vincular un proveedor SAML a un usuario existente usando linkWithRedirect() y linkWithPopup() , y volver a autenticar a un usuario con reauthenticateWithRedirect() y reauthenticateWithPopup() . que se puede utilizar para recuperar credenciales nuevas para operaciones confidenciales que requieren un inicio de sesión reciente.