Btukfyl

I am going to authenticate phone number in Ionic 3 using firebase, program runs without error but when I enters phone number then nothing happens..

.html code is below

<ion-item>

<ion-label stacked>Phone Number</ion-label>

<ion-input type="number" [(ngModel)]="phoneNumber"></ion-input>

</ion-item>   

<button ion-button id="sign-in-button" (click)="signIn(phoneNumber)">Send OTP</button>

<ion-input type="number" placeholder="OTP" [(ngModel)]="code"></ion-input>

<button ion-button id="verify-in-button" (click)="verify()">Sign In</button>

My .ts file is

 export class HomePage { 

 veryficationId : any;

 code :string = "";

 phoneNumber : number;

  constructor(public navCtrl:NavController, public 

alertCtrl:AlertController) { }



signIn(phoneNumber)

{

(<any>window).FirebasePlugin.verifyPhoneNumber("+91" +phoneNumber,60,(credential)=>{

this.veryficationId = credential.veryficationId;

}, (error)=> {     

alert("error" +error);

} );

}



verify()

{

let signInCredential = 

firebase.auth.PhoneAuthProvider.credential(this.veryficationId,this.code);

firebase.auth().signInWithCredential(signInCredential).then((info)=>{

}, (error)=>{ 

alert("error" +error);

} )

}



}

I don't understand what I am missing...

I highly suggest you read this great article from Jorge. It has all the details step by step.

signIn(phoneNumber: number){

  const appVerifier = this.recaptchaVerifier;

  const phoneNumberString = "+" + phoneNumber;

  firebase.auth().signInWithPhoneNumber(phoneNumberString, appVerifier)

    .then( confirmationResult => {

      // SMS sent. Prompt user to type the code from the message, then sign the

      // user in with confirmationResult.confirm(code).

      let prompt = this.alertCtrl.create({

      title: 'Enter the Confirmation code',

      inputs: [{ name: 'confirmationCode', placeholder: 'Confirmation Code' }],

      buttons: [

        { text: 'Cancel',

          handler: data => { console.log('Cancel clicked'); }

        },

        { text: 'Send',

          handler: data => {

            confirmationResult.confirm(data.confirmationCode)

            .then(function (result) {

              // User signed in successfully.

              console.log(result.user);

              // ...

            }).catch(function (error) {

              // User couldn't sign in (bad verification code?)

              // ...

            });

          }

        }

      ]

    });

    prompt.present();

  })

  .catch(function (error) {

    console.error("SMS not sent", error);

  });



}