I am trying to set up reCaptcha v3 and it sort of works. For some reason the first time I submit the form it fails but from the second submit onwards it is fine. I can’t figure out why this is happening?
<script src="https://www.google.com/recaptcha/api.js?render=MY_SITE_KEY"></script> <script> grecaptcha.ready(function () { grecaptcha.execute('MY_SITE_KEY', { action: 'contact' }).then(function (token) { var recaptchaResponse = document.getElementById('captcha-response'); recaptchaResponse.value = token; }); }); </script> <input type="hidden" name="captcha-response" id="captcha-response">
PHP
$verifyResponse = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret='.$secretKey.'&response='.$_POST['captcha-response']); $responseData = json_decode($verifyResponse); if(!$responseData->score < 0.5) { $message .= "Verification failed " . $responseData->score; }
When I submit the form the first time, I get the validation error but my score is 0.9.
Advertisement
Answer
Why you have added “!” with “$responseData->score”? you may need to replace your condition with the following:
Replace this:
if(!$responseData->score < 0.5) { $message .= "Verification failed " . $responseData->score; }
With this one:
if($responseData->score < 0.5) { $message .= "Verification failed " . $responseData->score; }
P.S: Following code takes few seconds to properly load and get a “captcha-reponse” code, so you may need to disable all submit button and wait till you got a “captcha-reponse” to enable the submit button in form or you needs to implementent another way to delay the submit to execute only once you got a “captcha-response” code otherwise you will keep getting “missing-input-response” error message
<script src="https://www.google.com/recaptcha/api.js?render=MY_SITE_KEY"></script> <script> grecaptcha.ready(function() { grecaptcha.execute('MY_SITE_KEY', { action: 'contact' }).then(function(token) { var recaptchaResponse = document.getElementById('captcha-response'); recaptchaResponse.value = token; }); }); </script>