signInWithPhoneNumber Firebase: Recaptcha verification failed – MALFORMED (auth/captcha-check-failed)

by

I’m trying to implement phone number login in my application using Firebase, but I’m encountering this error. When I make the request with a test phone number that I registered in the Firebase console, it works perfectly. However, when I try to use a real phone number, I encounter this error.

“firebase”: “^10.5.2”

Error: Firebase: Recaptcha verification failed – MALFORMED (auth/captcha-check-failed).

Firebase config code

import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
import { getAuth } from "firebase/auth";
import { getFunctions, connectFunctionsEmulator } from 'firebase/functions';
import { getStorage } from "firebase/storage";
import { getFirestore } from "firebase/firestore";

const firebaseConfig = {
  apiKey: "mykey",
  authDomain: "...",
  projectId: "...",
  storageBucket: "...",
  messagingSenderId: "...",
  appId: "...",
  measurementId: "..."
};

const app = initializeApp(firebaseConfig);

export const analytics = getAnalytics(app);
export const functions = getFunctions(app);
export const auth = getAuth(app);
export const storage = getStorage(app);
export const db = getFirestore(app);

auth.languageCode="pt-BR";

Login page code

  const handleSubmit = async () => {
    setShowBackDrop(true);

    const tel = `+55${soNumeros(whatsapp)}`;

    try {
      const recaptcha = new RecaptchaVerifier(auth, 'recaptcha', {
        'size': 'invisible',
        'callback': (response) => {
          console.log(response)
          // reCAPTCHA solved, allow signInWithPhoneNumber.
          onSignInSubmit();
        }
      });

      console.log(recaptcha)

      const verifi = await signInWithPhoneNumber(auth, tel, recaptcha)
      console.log(verifi)

      if (verifi) {
        setShowBackDrop(false)
        setConfirmation(verifi)
      }

    } catch (error) {
      console.log(error)
      setShowBackDrop(false);
      setError({
        whatsapp: {
          message: 'Telefone inválido.'
        },
        valid: false
      });
    }
  }

I was waiting for the SMS to be sent to real numbers, as well as fictitious numbers, I’ve watched several tutorials, but nothing helped, I’ve checked the configuration in the console several times, but nothing so far.
the application domains are configured in the authorized domains section, the tests are running on localhost for now, I haven’t tested it in production.

Leave a Comment