Search code examples
javascriptrecaptcha

reCAPTCHA - Same code - different action on pages


I have a problem with Google reCAPTCHA. On my blog* it doesn't work - but on the test page (in this case codepen) everything works without any problem. I don't know what can cause such an error.

... form...

<fieldset>
<div id="captcha"></div>
</fieldset>
... end form...
<script type="text/javascript">
var onload = function() {
grecaptcha.render('captcha', {
'sitekey' : 'Vaild Site Key',
'theme' : 'dark',
'hl': 'pl'
/* 'hl': 'en' */
});
};
</script>
<script async src="https://www.google.com/recaptcha/api.js?onload=onload"></script>
... other content

When I click to send the form (in my blog), such an error occurs: Uncaught Error: No reCAPTCHA clients exist.

This is what reCAPTCHA looks like on a blog:

reCAPTCHA on blog

ReCAPTCHA on codepen (Translated to EN):

reCAPTCHA on codepen

*[Info: The form is every post]


Solution

  • After hard work I managed to solve the problem by myself - in the script calling reCAPTCHA, it was enough to add a defer.

    <script src="https://www.google.com/recaptcha/api.js?onload=load&render=explicit" async defer></script>