Reputation: 51
I'm making a webapp with a contact form, and have a google reCAPTCHA (v2) on my website to prevent robot-spam.
I have added this code to the website:
<div class="g-recaptcha" data-sitekey=""></div>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
When I try to submit my form, I'm able to submit it without the reCAPTCHA being used.
Am I doing something wrong?
Upvotes: 2
Views: 12499
Reputation: 168
In addition to what Galzor said you need to implement a server side verification as described here https://developers.google.com/recaptcha/docs/verify
Steps are following:
add reCaptcha widget to the form you want to protect, use public key when you register widget (you should have it from console https://www.google.com/recaptcha/admin/create when you registered reCaptcha)
when you submit form, in javascript, check that capcha is solved by checking $("#g-recaptcha-response") input field for a long hashstring (token)
when your form submitted, on the server side, before processing anything, you need to call google Recaptcha Api with the Secret (private key from the console too) and verify response.
If you do not implement a server side verification a bot can add something looking as a normal response to the #g-recaptcha-response input and pass the client side validation. That also means it's not enough just check on the server or client side that input is not empty - You need to call ReCaptcha API and check it's response if the token is valid (Google provides ready library for php)
Upvotes: 2
Reputation: 845
you can use the following little jquery code to check if user is trying to submit the form without clicking the recaptcha.
$("form").submit(function(event) {
var recaptcha = $("#g-recaptcha-response").val();
if (recaptcha === "") {
event.preventDefault();
alert("Please check the recaptcha");
}
});
furthermore you can use the below code to make api call to check if the response is valid. In case the User has validated himself, the response will be a very long string.
if (grecaptcha.getResponse() == ""){
alert("You can't proceed!");
} else {
alert("Thank you");
}
take a look here How to Validate Google reCaptcha on Form Submit for more information on how to validate recaptcha.
Upvotes: 3