Menu
I have the following in my <body>
<div class="g-recaptcha" data-sitekey="some-key (original is right)">
and this on my <head>
<script src="//www.google.com/recaptcha/api.js"></script>
but nothing is shown, either on firefox or chrome... Is this a known issue?
889
One of the most common reasons why this error occurs is that of an outdated Chrome version. reCAPTCHA will actively look at the browser version before allowing you access. This is applicable to all browser versions, not just Chrome. In this case, the solution is to update Google Chrome to the latest version.
Add Google reCAPTCHA to a formClick the pencil icon or Edit on the form or newsletter block. In the Storage tab, click Google reCAPTCHA. Switch the Use Google reCAPTCHA toggle on. Repeat these steps for all form blocks on your site where you want to add a reCAPTCHA.
You can test invisible recaptcha by using Chrome emulator. You will need to add a new custom device (BOT) in developer tools, and set User Agent String to Googlebot/2.1 on Desktop . Then use the new BOT device when testing on your site to trigger the recaptcha authentication.
make sure that <script src="//www.google.com/recaptcha/api.js"></script> is the last thing before closing of head tag.
That fixed same problem for me
192
Just hit this obstacle, and in my case it was due to AngularJS. It's not limited to Angular, any library which binds the elements after page load can cause the Google reCAPTCHA to not show up since the element just does not exist by the time Google's code is being executed.
To solve this, first make the render explicit and supply a function to execute when the reCAPTCHA loads:
<script src='https://www.google.com/recaptcha/api.js?onload=recaptchaOnload&render=explicit' async defer></script>
Now, add a unique ID to the container, e.g.
<div id="recaptcha" class="g-recaptcha" data-sitekey="site key here"></div>
Then in the custom function wait for the element to actually exist:
var _captchaTries = 0;
function recaptchaOnload() {
_captchaTries++;
if (_captchaTries > 9)
return;
if ($('.g-recaptcha').length > 0) {
grecaptcha.render("recaptcha", {
sitekey: 'site key here',
callback: function() {
console.log('recaptcha callback');
}
});
return;
}
window.setTimeout(recaptchaOnload, 1000);
}
This will keep trying for 10 seconds, until it finds the element, then render the reCAPTCHA into it.
28
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
