Firebase invisible recaptcha with ionic 3

@pradeepkaatnam wrote:

I am working on an IONIC & FIREBASE application. I have integrated Phone authentication with invisible recaptcha provided by firebase as my auth in the app. As part of phone number verification with OTP, sometimes the invisible recaptcha prompts a recaptcha challenge for the user to solve in-order to proceed further. Now everything works fine if the challenge was solved successfully but if I select some wrong images in the recaptcha challenge then the pop up gets closed and no call back function is getting invoked.

This is my firebase RecaptchaVerifier code:

ngOnInit(){
    this.recaptchVerifier = new auth.RecaptchaVerifier('sign-in-button', {
      'size': 'invisible',
      'callback': function(response) {
        // reCAPTCHA solved, allow signInWithPhoneNumber.
        console.log("recapcha verified. ", response);
      },
      'expired-callback': function() {
        // Response expired. Ask user to solve reCAPTCHA again.
        // ...
        console.log("Recaptcha expired.");
        this.spinner.dismiss();
      },
      'error-callback': function() {
        console.log("Error occurred");
        this.spinner.dismiss();
      }
    });
  }

I have implemented all the callbacks available on the recapthca but nothing is getting invoked if the challenge was unsuccessful. So how do I know when user fails to solve the recaptcha challenge so that I can tell the user to try again.

Thanks in advance.

Posts: 1

Participants: 1

Read full topic