Question

未捕获的类型错误：无法读取未定义的属性（读取‘appVerificationDisabledForTesting’）ReactJS

2023-10-18

394

reactjs firebase-authentication

为什么我在使用 firebase 发送 otp 时会遇到此错误

这些是代码

import { RecaptchaVerifier, getAuth, signInWithPhoneNumber} from 'firebase/auth'; import { initializeApp } from 'firebase/app'

sendCode() { 
    window.appVerifier = new RecaptchaVerifier(
      "recaptcha-container",
      {
        size: "invisible",
      }
      , getAuth()
    );
    const appVerifier = window.appVerifier;
    this.setState({
      mobile: this.props.mobile,
      disabled: false,
    });
    var number = "+65 " + this.props.mobile;
    console.log(number);
    signInWithPhoneNumber(getAuth(), number, appVerifier)
      .then(function (confirmationResult) {
        console.log("Success");
        // SMS sent. Prompt user to type the code from the message, then sign the
        // user in with confirmationResult.confirm(code).
        window.confirmationResult = confirmationResult;
        this.setState({confirmResult: confirmationResult});
        console.log(confirmationResult);

componentDidMount() {
    initializeApp(firebaseConfig);
  }

<div id="recaptcha-container" />

我一直收到此错误

有人可以告诉我我哪里做错了吗？

谢谢！

Answer 1

也许这会有所帮助，

import { getAuth, RecaptchaVerifier } from "firebase/auth";

const auth = getAuth();
window.recaptchaVerifier = new RecaptchaVerifier(auth, 'recaptcha-container', 
{
  'size': 'normal',
});

根据 firebase docs ，第一个参数是 Auth ，然后是 containerOrId ，然后是 RecaptchaParameters

Answer 2

sendCode() {
    this.setState({
      mobile: this.state.mobile,
      disabled: false,
    });
    var number = "+65 " + this.state.mobile;
    console.log(number);

    window.recaptchaVerifier = new RecaptchaVerifier(getAuth(), "recaptcha-container", {
      'size': 'invisible'
    });
    const appVerifier = window.recaptchaVerifier;

    signInWithPhoneNumber(getAuth(), number, appVerifier)
    .then(function (confirmationResult) {
      console.log("Success");
      window.confirmationResult = confirmationResult;
      console.log(confirmationResult);