As per documentation of firebase for using re-CAPTCHA.
I created a div inside sign-up form.
<div id="recaptcha-container"></div>
and used the code as given in documentation -
import { getAuth, RecaptchaVerifier } from "https://www.gstatic.com/firebasejs/9.0.2/firebase-auth.js";
const auth = getAuth();
window.recaptchaVerifier = new RecaptchaVerifier('recaptcha-container', {}, auth);
But when I reload my sign-up.php page, my captcha didn't show. Even I didn't get any error in console.
Why am I not able to see captcha layout ?
I think you should specify the size to normal, try this:
import { getAuth, RecaptchaVerifier } from "https://www.gstatic.com/firebasejs/9.0.2/firebase-auth.js";
const auth = getAuth();
window.recaptchaVerifier = new RecaptchaVerifier('recaptcha-container', {'size': 'normal'}, auth);
pass the firebase config instance in getAuth
const app = initializeApp(firebaseConfig);
import { getAuth, RecaptchaVerifier } from "https://www.gstatic.com/firebasejs/9.1.1/firebase-auth.js";
const auth = getAuth(app);
window.recaptchaVerifier = new RecaptchaVerifier('recaptcha-container', { 'size': 'normal' }, auth);
recaptchaVerifier.render();
for me also same problem after pass this firbaseConfig instanse it shows the reCAPTCHA widget and render it