Return the firebase.auth message in typescript

Question

Return the firebase.auth message in typescript

Navigation

#1 by (1 votes)

0

I'm using Firebase in the back end of this login, but I'm not able to use the information that comes back from firebase.auth to check if it failed or not and thus set false or true authentication, msgErro turns a json object, which I can use in html using pipe | json that shows the message that I have returned within the error function.

Does anyone know how I can access this object and retrieve the information I need?

private usuario : Usuario = new Usuario();
private user: Observable<firebase.User>;
private verificarSenha: string;
private msgErro : any;
private autenticacao : boolean = true;

registrar(){
        if (this.verificarSenha == this.usuario.senha){
            this.register();
            //this.msgErro ? this.autenticacao = false : this.autenticacao = true;
        }
        else {
            this.msgErro = 'auth/wrong-password'
            this.autenticacao = false;
        }
    }

    register(){
        this.msgErro = firebase.auth().createUserWithEmailAndPassword(this.usuario.login, this.usuario.senha).catch(function(err : firebase.FirebaseError) {
            if (err.code){
                 if (err.code === 'auth/weak-password') {
                    return "A senha deve conter no mínimo 6 caracteres";
                }
                else if(err.code === 'auth/invalid-email'){
                    return "O email informado é invalido";
                }
                else {
                    return "O email informado ja está cadastrado";
                }
            }
        });
    }

<div class="login-page">
    <div class="form" [class.erro]="!autenticacao" >
        <div style="color: #4CAF50; margin-bottom : 20px">
            <h4>BEM VINDO AO UM HELP</h4>
            <p class="message">Por favor, insira o email e a senha que deseja usar</p>
        </div>
        <form class="login-form has-danger">
            <input [(ngModel)]="usuario.login" name="login" type="text" c placeholder="Usuario"/>
            <input [(ngModel)]="usuario.senha" name="senha" type="password" placeholder="Senha"/>
            <input [(ngModel)]="verificarSenha" name="verificar" type="password" placeholder="Repita a senha"/>
            <div class="form-control-feedback has-danger"> {{ msgErro.ya | json }} </div>
            <div *ngIf="msgErro == 'auth/wrong-password'" class="form-control-feedback has-danger">As senhas informadas não correspondem</div>
            <button (click)="registrar()">Registrar</button>
            <button>Google</button>
            <button>Facebook</button>
            <button>voltar</button>
        </form>
    </div>
</div>

firebase typescript

asked by anonymous 04.08.2017 / 07:15

1 answer

How do I solve this method create problem in Laravel How to do the fread () function fetch data every 30 seconds without refreshing the page

score 1 · Accepted Answer

First problem

The error message will not be returned by the function createUserWithEmailAndPassword but in the callback (anonymous function created to handle the error)

Second, the variable msgErro will not be accessible through this and so a variable must be created in the other name (_this for example) to assign the parent object

The solution is this

register() {
      let _this = this;

               firebase.auth().createUserWithEmailAndPassword(this.usuario.login, this.usuario.senha).catch(function(err : firebase.FirebaseError) {
                    if (err.code){
                         if (err.code === 'auth/weak-password') {
                            _this.msgErro = "A senha deve conter no mínimo 6 caracteres";
                        }
                        else if(err.code === 'auth/invalid-email'){
                           _this.msgErro = "O email informado é invalido";
                        }
                        else {
                            _this.msgErro = "O email informado ja está cadastrado";
                        }
                    }
                });
            }