Descubre las novedades de Firebase en Google I/O 2022. Más información

Autenticarse con Firebase usando enlaces de correo electrónico

Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

Puede usar Firebase Authentication para iniciar sesión en un usuario enviándole un correo electrónico que contenga un enlace, en el que puede hacer clic para iniciar sesión. En el proceso, también se verifica la dirección de correo electrónico del usuario.

Hay numerosos beneficios al iniciar sesión por correo electrónico:

  • Registro e inicio de sesión de baja fricción.
  • Menor riesgo de reutilización de contraseñas entre aplicaciones, lo que puede socavar la seguridad incluso de contraseñas bien seleccionadas.
  • La capacidad de autenticar a un usuario y al mismo tiempo verificar que el usuario es el propietario legítimo de una dirección de correo electrónico.
  • Un usuario solo necesita una cuenta de correo electrónico accesible para iniciar sesión. No se requiere la propiedad de un número de teléfono o cuenta de redes sociales.
  • Un usuario puede iniciar sesión de forma segura sin necesidad de proporcionar (o recordar) una contraseña, lo que puede resultar engorroso en un dispositivo móvil.
  • Un usuario existente que haya iniciado sesión previamente con un identificador de correo electrónico (contraseña o federado) puede actualizarse para iniciar sesión solo con el correo electrónico. Por ejemplo, un usuario que ha olvidado su contraseña aún puede iniciar sesión sin necesidad de restablecer su contraseña.

Antes de que empieces

  1. Si aún no lo ha hecho, siga los pasos de la guía de inicio .

  2. Habilite el inicio de sesión con enlace de correo electrónico para su proyecto de Firebase.

    Para que los usuarios inicien sesión mediante un enlace de correo electrónico, primero debe habilitar el proveedor de correo electrónico y el método de inicio de sesión con enlace de correo electrónico para su proyecto de Firebase:

    1. En Firebase console , abra la sección Auth .
    2. En la pestaña Método de inicio de sesión , habilite el proveedor de correo electrónico/contraseña . Tenga en cuenta que el inicio de sesión con correo electrónico/contraseña debe estar habilitado para usar el inicio de sesión con enlace de correo electrónico.
    3. En la misma sección, habilite el método de inicio de sesión Enlace de correo electrónico (inicio de sesión sin contraseña) .
    4. Haga clic en Guardar .

Para iniciar el flujo de autenticación, presente una interfaz que solicite al usuario que proporcione su dirección de correo electrónico y luego llame a sendSignInLinkToEmail() para solicitar que Firebase envíe el enlace de autenticación al correo electrónico del usuario.

  1. Construya el objeto ActionCodeSettings, que proporciona a Firebase instrucciones sobre cómo construir el enlace de correo electrónico. Configure los siguientes campos:

    • url : el enlace profundo para incrustar y cualquier estado adicional que se transmita. El dominio del vínculo debe incluirse en la lista blanca de la lista de dominios autorizados de Firebase Console, que se puede encontrar yendo a la pestaña Método de inicio de sesión (Autenticación -> Método de inicio de sesión). El enlace redirigirá al usuario a esta URL si la aplicación no está instalada en su dispositivo y no se pudo instalar.

    • androidPackageName e IOSBundleId : las aplicaciones que se usarán cuando se abra el enlace de inicio de sesión en un dispositivo Android o iOS. Obtenga más información sobre cómo configurar Firebase Dynamic Links para abrir vínculos de acción de correo electrónico a través de aplicaciones móviles.

    • handleCodeInApp : establecer en true . La operación de inicio de sesión siempre debe completarse en la aplicación, a diferencia de otras acciones de correo electrónico fuera de banda (restablecimiento de contraseña y verificaciones de correo electrónico). Esto se debe a que, al final del flujo, se espera que el usuario haya iniciado sesión y su estado de autenticación persista dentro de la aplicación.

    • dynamicLinkDomain : cuando se definen varios dominios de enlace dinámico personalizados para un proyecto, especifique cuál usar cuando el enlace se abra a través de una aplicación móvil específica (por ejemplo, example.page.link ). De lo contrario, el primer dominio se selecciona automáticamente.

    var acs = ActionCodeSettings(
        // URL you want to redirect back to. The domain (www.example.com) for this
        // URL must be whitelisted in the Firebase Console.
        url: 'https://www.example.com/finishSignUp?cartId=1234',
        // This must be true
        handleCodeInApp: true,
        iOSBundleId: 'com.example.ios',
        androidPackageName: 'com.example.android',
        // installIfNotAvailable
        androidInstallApp: true,
        // minimumVersion
        androidMinimumVersion: '12');
    
  2. Pide al usuario su correo electrónico.

  3. Envíe el enlace de autenticación al correo electrónico del usuario y guarde el correo electrónico del usuario en caso de que el usuario complete el inicio de sesión de correo electrónico en el mismo dispositivo.

    var emailAuth = 'someemail@domain.com';
    FirebaseAuth.instance.sendSignInLinkToEmail(
            email: emailAuth, actionCodeSettings: acs)
        .catchError((onError) => print('Error sending email verification $onError'))
        .then((value) => print('Successfully sent email verification'));
    });
    

Preocupaciones de seguridad

Para evitar que se use un enlace de inicio de sesión para iniciar sesión como un usuario no deseado o en un dispositivo no deseado, Firebase Auth requiere que se proporcione la dirección de correo electrónico del usuario al completar el flujo de inicio de sesión. Para que el inicio de sesión sea exitoso, esta dirección de correo electrónico debe coincidir con la dirección a la que se envió originalmente el enlace de inicio de sesión.

Puede simplificar este flujo para los usuarios que abren el enlace de inicio de sesión en el mismo dispositivo en el que solicitan el enlace, almacenando su dirección de correo electrónico localmente, por ejemplo, usando SharedPreferences, cuando envía el correo electrónico de inicio de sesión. Luego, use esta dirección para completar el flujo. No pase el correo electrónico del usuario en los parámetros de la URL de redireccionamiento y reutilícelo, ya que esto puede permitir inyecciones de sesión.

Después de completar el inicio de sesión, cualquier mecanismo de inicio de sesión no verificado anterior se eliminará del usuario y se invalidarán todas las sesiones existentes. Por ejemplo, si alguien creó anteriormente una cuenta no verificada con el mismo correo electrónico y contraseña, la contraseña del usuario se eliminará para evitar que el suplantador que reclamó la propiedad y creó esa cuenta no verificada vuelva a iniciar sesión con el correo electrónico y la contraseña no verificados.

También asegúrese de usar una URL HTTPS en producción para evitar que su enlace sea potencialmente interceptado por servidores intermediarios.

Firebase Authentication usa Firebase Dynamic Links para enviar el vínculo del correo electrónico a un dispositivo móvil. Para completar el inicio de sesión a través de la aplicación móvil, la aplicación debe configurarse para detectar el enlace de la aplicación entrante, analizar el enlace profundo subyacente y luego completar el inicio de sesión.

  1. Configura tu aplicación para recibir Dynamic Links en Flutter en la guía .

  2. En su controlador de enlaces, verifique si el enlace está destinado a la autenticación de enlaces de correo electrónico y, de ser así, complete el proceso de inicio de sesión.

    // Confirm the link is a sign-in with email link.
    if (FirebaseAuth.instance.isSignInWithEmailLink(emailLink)) {
      try {
        // The client SDK will parse the code from the link for you.
        final userCredential = await FirebaseAuth.instance
            .signInWithEmailLink(email: emailAuth, emailLink: emailLink);
    
        // You can access the new user via userCredential.user.
        final emailAddress = userCredential.user?.email;
    
        print('Successfully signed in with email link!');
      } catch (error) {
        print('Error signing in with email link.');
      }
    }
    

También puede vincular este método de autenticación a un usuario existente. Por ejemplo, un usuario previamente autenticado con otro proveedor, como un número de teléfono, puede agregar este método de inicio de sesión a su cuenta existente.

La diferencia estaría en la segunda mitad de la operación:

final authCredential = EmailAuthProvider
    .credentialWithLink(email: emailAuth, emailLink: emailLink.toString());
try {
    await FirebaseAuth.instance.currentUser
        ?.linkWithCredential(authCredential);
} catch (error) {
    print("Error linking emailLink credential.");
}

Esto también se puede usar para volver a autenticar a un usuario de enlace de correo electrónico antes de ejecutar una operación confidencial.

final authCredential = EmailAuthProvider
    .credentialWithLink(email: emailAuth, emailLink: emailLink.toString());
try {
    await FirebaseAuth.instance.currentUser
        ?.reauthenticateWithCredential(authCredential);
} catch (error) {
    print("Error reauthenticating credential.");
}

Sin embargo, como el flujo podría terminar en un dispositivo diferente donde el usuario original no inició sesión, es posible que este flujo no se complete. En ese caso, se le puede mostrar un error al usuario para obligarlo a abrir el enlace en el mismo dispositivo. Se puede pasar algún estado en el enlace para proporcionar información sobre el tipo de operación y el uid del usuario.

En caso de que admita el inicio de sesión basado en contraseña y enlace con correo electrónico, para diferenciar el método de inicio de sesión para un usuario de contraseña/enlace, use fetchSignInMethodsForEmail . Esto es útil para los flujos de identificador primero donde primero se le pide al usuario que proporcione su correo electrónico y luego se le presenta el método de inicio de sesión:

try {
    final signInMethods =
        await FirebaseAuth.instance.fetchSignInMethodsForEmail(emailAuth);
    final userExists = signInMethods.isNotEmpty;
    final canSignInWithLink = signInMethods
        .contains(EmailAuthProvider.EMAIL_LINK_SIGN_IN_METHOD);
    final canSignInWithPassword = signInMethods
        .contains(EmailAuthProvider.EMAIL_PASSWORD_SIGN_IN_METHOD);
} on FirebaseAuthException catch (exception) {
    switch (exception.code) {
        case "invalid-email":
            print("Not a valid email address.");
            break;
        default:
            print("Unknown error.");
    }
}

Como se describe anteriormente, el correo electrónico/contraseña y el correo electrónico/enlace se consideran el mismo EmailAuthProvider (mismo PROVIDER_ID ) con diferentes métodos de inicio de sesión.

Próximos pasos

Después de que un usuario crea una nueva cuenta, esta cuenta se almacena como parte de su proyecto de Firebase y se puede usar para identificar a un usuario en cada aplicación de su proyecto, independientemente del método de inicio de sesión que haya usado el usuario.

En sus aplicaciones, puede obtener la información básica del perfil del User del objeto Usuario. Consulte Administrar usuarios .

En sus Reglas de seguridad de Firebase Realtime Database y Cloud Storage, puede obtener el ID de usuario único del usuario que inició sesión de la variable auth y usarlo para controlar a qué datos puede acceder un usuario.

Puede permitir que los usuarios inicien sesión en su aplicación utilizando varios proveedores de autenticación vinculando las credenciales del proveedor de autenticación a una cuenta de usuario existente.

Para cerrar la sesión de un usuario, llame signOut() :

await FirebaseAuth.instance.signOut();