Google recaptcha, how to use it.
You probably already know about captcha, if not, it’s the piece of characters and numbers that you get in some forms. It’s meant to be a security so robots could not automatically fill forms. But robots got betters at reading them, so developpers generated stronger captcha harder to read even as human.
Recently, google released a system that is drastically simplifying the captcha. It’s just a checkbox that say, “i’m not a robot“. So as a user you just have to click on it but to a bot it’s a mutch bigger deal.
Google created an algorithm which, based on many data such as mouse moves, clicks and many other, helps to determine if you’re a robot or not. Off course this algorithm is kept secret.
I’ve already integrated it in the contact form of this site and i’m going to show you how to do so on your hown. It does comes in two steps, the form integration on client side and server side to check if the user is or isn’t a robot.
First, you need to get a private and a public key, so go to this dedicated website and click on “Get reCAPTCHA”, you’ll need to fill up a form with the name of the page and the domains you want to use it for. Go with “Contact form” and “localhost” as a domain for now. You can put here any domain you want to use.
Now that you have a generated key, simply integrate this code into your form and replace $$Your sitekey$$ by your actual site key delivered by google.
<div class="g-recaptcha" data-sitekey="$$Your sitekey$$"></div>
You can now open your form and check if it’s working.
Now comes the triky part, the server side. When you submit the form, google will add a data into your content called “g-recaptcha-response“. Deppending of the programming language you’re using, you’ll have to get this value, to pass it back to google using a server side get request and check the result which comes in JSON.
Here is an example of what you can do in PHP :
And you are done. Pretty cool isn’t it ?