Comienza con la autenticación de Firebase en sitios web

Puedes usar la autenticación de Firebase para permitir que los usuarios inicien sesión en tu aplicación usando uno o más métodos de inicio de sesión, incluyendo el inicio de sesión con dirección de correo electrónico y contraseña, y proveedores de identidad federados como Google Sign-in y Facebook Login. Este tutorial le permite comenzar a utilizar la autenticación de Firebase y le muestra cómo añadir el inicio de sesión con dirección de correo electrónico y contraseña a su aplicación.

Conecte su aplicación a Firebase

Instale el SDK de Firebase. Asegúrate de pegar el código de configuración en tu página web como se ha descrito.

(Opcional) Prototipo y prueba con Firebase Local Emulator Suite

Antes de hablar de cómo tu app autentifica a los usuarios, vamos a presentar un conjunto de herramientas que puedes utilizar para crear un prototipo y probar la funcionalidad de autenticación:Firebase Local Emulator Suite. Si estás decidiendo entre técnicas y proveedores de autenticación, probando diferentes modelos de datos con datos públicos y privados usando Autenticación y Reglas de Seguridad de Firebase, o prototipando diseños de UI de inicio de sesión, ser capaz de trabajar localmente sin desplegar servicios en vivo puede ser una gran idea.

Un emulador de Autenticación es parte de la Suite del Emulador Local, que permite a tu aplicación interactuar con el contenido y la configuración de la base de datos emulada, así como opcionalmente con los recursos de tu proyecto emulado (funciones, otras bases de datos y reglas de seguridad). Tenga en cuenta que el Local Emulator Suite todavía no soporta el almacenamiento emulado.

Usar el emulador de autenticación implica sólo unos pocos pasos:

1. Añadir una línea de código a la configuración de prueba de su aplicación para conectarse al emulador.
2. Desde la raíz del directorio de tu proyecto local, ejecutando firebase emulators:start.
3. Utilizando la UI del Emulador Local para la creación de prototipos interactivos, o la API REST del emulador de autenticación para pruebas no interactivas.

Una guía detallada está disponible en Conecte su aplicación al emulador de autenticación.Para obtener más información, consulte la introducción de Local Emulator Suite.

Ahora vamos a continuar con la forma de autenticar a los usuarios.

Registre a los nuevos usuarios

Cree un formulario que permita a los nuevos usuarios registrarse en su aplicación utilizando su dirección de correo electrónico y una contraseña. Cuando un usuario complete el formulario, valida la dirección de correo electrónico y la contraseña proporcionadas por el usuario, y luego las pasa al métodocreateUserWithEmailAndPassword:

Ingresar usuarios existentes

Crea un formulario que permita a los usuarios existentes ingresar utilizando su dirección de correo electrónico y su contraseña. Cuando un usuario complete el formulario, llama al métodosignInWithEmailAndPassword:

Configura un observador del estado de autenticación y obtén los datos del usuario

Para cada una de las páginas de tu aplicación que necesite información sobre el usuario registrado, adjunta un observador al objeto de autenticación global. Este observador se llama cada vez que el estado de inicio de sesión del usuario cambia.

Adjunta el observador utilizando el método onAuthStateChanged. Cuando un usuario inicia sesión con éxito, puedes obtener información sobre el usuario en el observador.

Aprende a añadir soporte para otros proveedores de identidad y cuentas anónimas invitadas:

• Inicio de sesión de Google
• Inicio de sesión de Facebook
• Inicio de sesión de Twitter
• Inicio de sesión de GitHub
• Inicio de sesión anónimo