22 comentarios en “Tutorial de Ionic – Firebase – parte 1: Autenticación con correo y contraseña

  1. Hola de nuevo. Tengo una pregunta y espero me ayudes.
    En su código usted ha validado que si la sesión es falsa la pagina root sea login sin posibilidad de mostrar otra pagina. Mi duda es la siguiente …¿Que tendria que modificar para poder realizar el registro desde otra pagina y no desde el mismo login?

    1. Hola Luis,

      En este ejemplo unifique en un mismo formulario el registro y el login para hacerlo más sencillo,
      para hacer el registro desde otra página simplemente debes crear una página de registro y poner un enlace o un botón en la página de login que en el evento click llame a una función del controlador y luego dentro de esa función hacer que se muestre la página de registro:

      this.navCtrl.push(‘RegistroPage’);

      En la página de registro tienes que importar el AuthProvider y poner el código para registrar un usuario.

      Un saludo

      1. Gracias por su respuesta. Ya he realizado dicho cambio pero el codigo de sesion mantiene la rootpage solo en el login si es que no hay sesion y no me permite mandar otra pagina. quizas sepa alguna manera de solucionar esto?

        1. Hola, excelente post y de antemano gracias.Me preguntaba si me podrias ayudar sobre como hacer que cuando ya esta echa la cuenta en la base de datos, si la ingreso con login me mande a la sesion q inicio.
          ejmplo:una page de perfil q muestre q ya inicio o esta dentro de la sesion

          1. Hola Miguel,

            En app.component.ts puedes mandar a la página de login cuando no hay session:
            this.auth.Session.subscribe(session=>{
            if(!session){
            this.rootPage = ‘LoginPage’;
            }
            });

            Y luego en el controlador de la página de login en el método login cuando se ha logeado correctamente mandarle a la página que quieras con setRoot, por ejemplo:

            login()
            {
            this.auth.loginUser(this.user.email,this.user.password ).then((user) => {
            this.navCtrl.setRoot(TuPaginaDeUsiario); // aquí le mandamos a la página que deseemos una vez se ha logeado
            }
            )
            .catch(err=>{
            let alert = this.alertCtrl.create({
            title: ‘Error’,
            subTitle: err.message,
            buttons: [‘Aceptar’]
            });
            alert.present();
            })
            }

            Espero que te ayude.

            Un saludo

      2. Hola, exelente tutorial, tengo un problema, no me funciona el ingreso, tengo todo tal cual como usted, pero al momento de ingresar con mi correo y contraseña (ya registrados) y presionar “login” cambia de pagina, se mantiene en el login siempre, ojala pueda ayudarme

  2. Sabe que al cambiar el root en el app.component para saber si la sesión está activa o no, me lanza el error: uncaught (in promise): invalid link: TabsPage.

  3. Hola, Muchas gracias por compartir este tipo de post… son de gran ayuda! Tengo una duda en el caso de que queramos validar que ese usuario que se esta dando de alta con el correo electrónico como podríamos activar la cuenta? como en la mayoria de sitios hay que validar antes de poder iniciar. Gracias

  4. Hola muy bueno el post, pero me esta dando este error;
    Runtime Error
    Uncaught (in promise): invalid link: HomePage

    Tiene que ver con la validacion en app.components

    this.auth.Session.subscribe(session => {
    if(session){
    this.rootPage = ‘HomePage’;
    }
    else{
    this.rootPage = ‘LoginPage’;
    }
    });

    Espero puedas ayudarme, saludos

    1. Hola hvallenilla,
      Si tu pagina HomePage no tiene creado el archivo home.module.ts tienes que poner HomePage sin comillas.
      Al generar una pagina con ionic generator se crea automáticamente el archivo home.module.ts sin embargo al generar una proyecto por defecto crea la página home sin el archivo de módulo.

      Un saludo

  5. Buenas tardes , antes que nada muy buen post todo clarisimo, una duda aver si pueden ayudarme, como le puedo pasar los datos introducidos en el login a otra pantalla ? es decir , si yo introduzco el correo y la contraseña, en la siguiente pagina me ponga Bienvenido “y el correo” , gracias.

    1. Hola Juan.

      Una forma de hacerlo puede ser en el provider auth.ts añadir una función que te devuelva el email, podría ser algo como esto:

      getUserEmail(){
      return this.afAuth.auth.currentUser.email;
      }

      luego en el controlador de donde quieras mostrarlo importar el provider, inyectarlo en el constructor y crear una variable para contener el email que luego mostrarás donde necesites, por ejemplo:

      this.userEmail = this.auth.getUserEmail(); // habiendo declarado antes la variable userEmail como miembro de la clase.

      Un saludo

  6. hola gran articulo, todo funciono correctamente. Una preguntilla como puedo modificar las alert de autentificacion? están en ingles para ponerlas en español
    Contraseña incorrecta….

  7. Hola! muchas gracias por tus increíbles artículos! quería consultar si me podrías ayudar en lo siguiente: como puedo obtener el id que firebase asigno al usuario que tiene sesion activa?

    Muchas gracias!

      1. Muchas gracias! yo sabia que en alguno de los artículos lo había visto! pero después no lo encontré! muchas gracias por la respuesta!

  8. Hola buenas noches, lo que pasa es que cuando voy a enviar datos de loginPages otra pagina MisTabsPage,a tra ves de this.navCtrl.push(PerfilPage, {nuser:nuser});, me los carga momentania mente y luego me los borra, creo que es por la parte de app component.ts

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.