Open zachasme opened 4 years ago
Anas-7
commented
6 months ago I have the exact same issue as @andresemartinez where the image selector is causing the issue in the recaptcha_en.js file. I face this issue even on normal selectors, and as mentioned when invalid-phone-number error occurs. In my case, I face it even if no error occurs in Firebase sometimes making the entire feature quite unreliable
Anas-7
commented
6 months ago Hi all, I was recently working on this problem and might have at least a temporary solution. I suggest calling the reset function in each type of callback of the recaptchaVerifier. I have done this with Firebase version 10.8.0
Here is a code snippet of the same:
if (!window.recaptchaVerifier) {
const button = document.getElementById('recaptcha-container');
if (button !== undefined && button !== null) {
const verifier = new RecaptchaVerifier(auth, 'recaptcha-container', {
size: 'invisible',
/*
Motivation for the code:
1. https://github.com/firebase/firebase-js-sdk/issues/3356
2. https://github.com/jsardev/reaptcha/issues/218
3. https://github.com/dozoisch/react-google-recaptcha/issues/129
Cannot read property 'style' of null was the error message, and to get/test this error do the following steps:
1. Enter a number, and an invalid number ideally
2. Keep trying to submit till you see the captcha of image selector where it asks you to select buses, etc
3. Once you click on Verify, it will show an error screen, and in some cases even when number was valid.
Since the error was not due to any other code in this file, I decided to reset the captcha in each type of callback, and this seems to have solved the error
*/
callback: () => {
window.recaptchaVerifier.recaptcha.reset();
},
'expired-callback': () => {
window.recaptchaVerifier.recaptcha.reset();
},
'error-callback': () => {
window.recaptchaVerifier.recaptcha.reset();
},
});
window.recaptchaVerifier = verifier;
}
}
philly-vanilly
commented
5 months ago HEY GUYS I FOUND THE SOLUTION ...APPARENTLY I WAS USING TEST PHONE NUMBERS BUT ONCE I SIGN IN WITH IT I NEED TO DELETE THAT ACCOUNT FROM FIREBASE USERS SECTION TO BE ABLE TO LOGIN AGAIN WITH THAT TEST NUMBER OTHERWISE RECAPTCHA THROWS THIS ERROR...this worked for me i hope it helps
why are you shouting
Describe your environment
Describe the problem
I am setting up Phone Auth with firebase. If there is a problem with the phone number (too long, too short, etc), but the captcha is shown (delaying the error until after resolving the captcha), the following error is thrown:
I have a feeling it happens when firebase auth attemps to reset the recaptcha after a problem with phone auth occurs.
There is no issue when captcha is shown but phone number is valid.
Steps to reproduce:
Relevant Code:
https://codesandbox.io/s/compassionate-bouman-vw5zn?file=/index.html
Related issues: