I need help with my recaptcha

276 views
Skip to first unread message

김주용

unread,
Mar 27, 2023, 1:06:35 PM3/27/23
to Firebase Google Group
I'm trying to use phone authentication for a website i'm making
If the recaptcha makes challenge with a simple checkbox, it works fine but whenever the recaptcha makes a 'image puzzle' challenge, an error occurs:
TypeError: null is not an object (evaluating 'Q.style') at recaptcha__en.js:5061
I have no idea why this is happening since recaptcha__en.js is not under my control.
Please help :(

Just in case, I'm trying to develop this on vue3 project, and the following are my related functions.


function sendCode(data) {
const val = phoneNumberInput.value.validate(data)
console.log(val)
if (val) {
signIn(data)
}
}

function generateRecaptcha() {
window.recaptchaVerifier = new RecaptchaVerifier('recaptcha-container', {}, auth);
}

const removeRecaptcha = () => {
window.recaptchaVerifier.render().then(function(widgetId) {
grecaptcha.reset(widgetId);
});
// if (window.recaptchaVerifier) {
// window.recaptchaVerifier.clear();
// window.recaptchaVerifier = null;
// }
};

function signIn() {
console.log('signin')
generateRecaptcha()
const appVerifier = window.recaptchaVerifier
signInWithPhoneNumber(auth, '+82' + phoneNumber.value, 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;
console.log(confirmationResult)
console.log('hi')
removeRecaptcha()
page.value++
}).catch((error) => {
// Error; SMS not sent
removeRecaptcha()
console.log(error)
});
}

function verifyOTP(code) {
window.confirmationResult.confirm(code).then((result) => {
// User signed in successfully.
const user = result.user;
console.log(result)
page.value ++
}).catch((error) => {
// User couldn't sign in (bad verification code?)
$q.notify({
message: 'wrong code',
color: 'negative',
position: 'top'
})
console.log(error)
});
}

function getPrivacy() {
fetch('/texts/privacy.txt').then((res)=>{
res.text().then((text)=>{
privacyText.value = text
})
})
}
When the user types in the phone number and then submits, it triggers sendCode(data) with data being the phone number
Reply all
Reply to author
Forward
0 new messages