Firebase otp recaptcha 错误：无法读取未定义的属性（读取“appVerificationDisabledForTesting”）

Question

我正在使用 firebase 生成 otp，但收到有关 appVerificationDisabledForTesting 未定义的错误。

recaptcha_verifier.ts:114 Uncaught TypeError: Cannot read properties of undefined (reading 'appVerificationDisabledForTesting')
    at new RecaptchaVerifier (recaptcha_verifier.ts:114:1)
    at generateRecaptcha (Home.js:123:1)
    at handleSend (Home.js:139:1)

这是我正在使用的代码

const handleSend = (event) => {
    event.preventDefault();

    generateRecaptcha();
    let appVerifier = window.recaptchaVerifier;
    signInWithPhoneNumber(auth, phoneNumber, appVerifier)
      .then((confirmationResult) => {
        // SMS sent. Prompt user to type the code from the message, then sign the
        // user in with confirmationResult.confirm(code).
        window.confirmationResult = confirmationResult;
      })
      .catch((error) => {
        // Error; SMS not sent
        console.log(error);
      });
  };

错误来自generateRecaptcha();

const generateRecaptcha = () => {
    window.recaptchaVerifier = new RecaptchaVerifier(
      "recaptcha",
      {
        size: "invisible",
        callback: (response) => {
          // reCAPTCHA solved, allow signInWithPhoneNumber.
          // ...
        },
      },
      auth
    );
  };

Answer 1

摘自发行说明：

重新排序

RecaptchaVerifier

参数，因此

auth

是第一个参数。

---

只需更改启动时的安排即可

RecaptchaVerifier

，如下所示：

Firebase < 9:

new RecaptchaVerifier('recaptcha-container', {}, auth);

Firebase > 10：

new RecaptchaVerifier(auth, 'recaptcha-container', {});

Answer 2

“firebase”：“^9.4.1”

将 firebase 版本更改为 9.4.1，它将可以工作，我也遇到了这个错误，并且一直在寻找解决方案，这是我现在得到的唯一解决方案

Answer 3

成功了*****

之前：
函数 setUpRecaptha(数字) { const recaptchaVerifier = new RecaptchaVerifier( “验证码容器”， {}, 授权 ）； recaptchaVerifier.render(); 返回signInWithPhoneNumber(auth, number, recaptchaVerifier); }

之后：函数 setUpRecaptha(number) { const recaptchaVerifier = new RecaptchaVerifier(auth, “验证码容器”， {} ）； recaptchaVerifier.render(); 返回signInWithPhoneNumber(auth, number, recaptchaVerifier); }