How to use Firebase invisible reCAPTCHA for angular web app?

Question

Hoping to see a working example. Searched quite a bit, can\'t seem to get it working locally. Always shows privacy terms logo & user has to interact with captcha.

Answer 1

Here is a working example with invisible reCAPTCHA:

https://github.com/firebase/quickstart-js/blob/master/auth/phone-invisible.html

In your code, after you call signInWithPhoneNumber, invisible reCAPTCHA should either display a challenge which when solved, resolves the pending promise with the confirmationResult, or directly resolves without showing any challenge.

When that promise resolves with confirmationResult, you should ask the user for the SMS code. You then call confirmationResult.confirm(code) This will complete sign in of the user.

firebase
  .auth()
  .signInWithPhoneNumber(phoneNumber, appVerifier)
  .then(function(confirmationResult) {
    var code = window.prompt("Please enter your code");
    return confirmationResult.confirm(code);
  })
  .then(function(result) {
    // User is signed in now.
  })
  .catch(function(error) {
    console.log("error", error);
  });