snippets-web icon indicating copy to clipboard operation
snippets-web copied to clipboard

error is showing using invisible recaptch in localhost

Open sanchitbajaj123 opened this issue 5 months ago • 0 comments

error: recaptcha_verifier.ts:114 Uncaught TypeError: Cannot read properties of undefined (reading 'appVerificationDisabledForTesting') at new RecaptchaVerifier (recaptcha_verifier.ts:114:1) at otpform.js:17:1 at commitHookEffectListMount (react-dom.development.js:23189:1) at commitPassiveMountOnFiber (react-dom.development.js:24965:1) at commitPassiveMountEffects_complete (react-dom.development.js:24930:1) at commitPassiveMountEffects_begin (react-dom.development.js:24917:1) at commitPassiveMountEffects (react-dom.development.js:24905:1) at flushPassiveEffectsImpl (react-dom.development.js:27078:1) at flushPassiveEffects (react-dom.development.js:27023:1) at react-dom.development.js:26808:1 my code useEffect(() => { // Set up the ReCAPTCHA verifier when the component mounts window.recaptchaVerifier = new RecaptchaVerifier('recaptcha-container', { 'size': 'normal', 'callback': (response) => { // ReCAPTCHA solved, allow OTP sending handleSendOtp(); } }, auth); }, [auth]);

const handleSendOtp = () => { const appVerifier = window.recaptchaVerifier;

signInWithPhoneNumber(auth, phoneNumber, appVerifier)
  .then((confirmationResult) => {
    // SMS sent. Save the confirmation result for later verification.
    setVerificationId(confirmationResult.verificationId);
    setIsOtpSent(true);
  })
  .catch((error) => {
    console.error("Error during sign-in with phone number:", error);
    // Handle error, e.g., show a message to the user
  });

};

sanchitbajaj123 avatar Sep 04 '24 16:09 sanchitbajaj123