1

I have added the google recaptcha in custom popup. But, form is also submitting without captcha.

I have used following codes for captcha:

 <script src='https://www.google.com/recaptcha/api.js'></script>
<div class="g-recaptcha" data-sitekey="XXXXXXXXXX"></div>

I have also used js code for validating. But, I think it's not proper way to validate it.

=> js code :

function checkcaptcha() {
        if((jQuery('#g-recaptcha-response').val())=='') {
            jQuery('.captcha-error').css('display','block');
            return false;
        } else {
            jQuery('.captcha-error').css('display','none');
        }

    }

Please help me for validating reCaptcha in proper way.

Thanks.

Note : Do not suggest any extension link here. I want to check programmatically.

  • is it invisible captcha or "i'm not robot" captcha? – Mohit Rane Jul 10 at 5:33
2

I think you have to try with using google recaptcha div class instead of id in jquery to getting google recaptcha response. I have tried below code and it's working for me:-

<div class="news-captcha">
  <div class="g-recaptcha" data-sitekey="XXXXXXXXXX"></div>
</div>

JS CODE:-

var googleResponse = jQuery('.news-captcha .g-recaptcha-response').val();
if (googleResponse!= ""){
    return true;
}
else {
    return false;
}

After getting response you have to pass this response in input "hidden" field. In the form submit action controller function you can use this hidden field post value and check there that recaptcha response getting or empty response.

1

I have done this way in Controller file,

$secretKey = 'yourkey';
$remoteIp = $this->remoteAddress->getRemoteAddress(); // add this class `\Magento\Framework\Http\PhpEnvironment\RemoteAddress` in construct
$response = null;
$response = $this->getRequest()->getParam('g-recaptcha-response');
$path = 'https://www.google.com/recaptcha/api/siteverify?';
$response = file_get_contents($path."secret=$secretKey&response=$response&remoteip=$remoteIp");
$answers = json_decode($response, true);

if (trim($answers['success']) != true) {
     $this->messageManager->addError("Invalid Captcha!");
} else {
  // Do your code here
}

Hope it helps.

  • +1 for your effort. But, it's 1 year ago question. So, I can't check it now. – Rohan Hapani Jul 10 at 6:04
0

Please Try with below code :

<form>
<script src='https://www.google.com/recaptcha/api.js'></script>
<div class="g-recaptcha" data-sitekey="XXXXXXXXXX"></div>
<input type="button" name="submit" value="Sub" onclick="checkcaptcha();">
<div id="captcha-error"><span></span></div>

</form>

<script type="text/javascript">
    function checkcaptcha() {
        var googleResponse = jQuery('.g-recaptcha-response').val();
        if(googleResponse !='') {
            jQuery("#captcha-error span").text("Your text here");
            jQuery('.captcha-error').css('display','block');
            return false;
        } 

    }
</script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.