Invisible Captcha

As an end user, I'd put filling out a captcha right up there with doing my taxes as one of the necessary annoyances in life.  But, they are extremely important in today's web apps, or heck even 10 years ago's web apps.  Lets just say they're important at scrubbing bad noise out and leave it at that.  Cool thing is, there is a way to implement captchas invisibly so that you dont even know they are there.

In case you dont know what a captcha is, it can take on many forms, often looking like the screenshot above.  The concept is simple - end users perform some activity that would be diffcult to programatically accomplish with a bot.  Essentially a turing test to prove that you are indeed human.  

The invisible captcha is nice for end users because they don't have to retype a sloppily written word fifteen times (which is super annoying).  This in turn can help with gated area's bounce rates where data is collected.   Registration forms, feedback forms, commenting systems are all good examples of where captchas are useful. 

On the back end where the collected data is processed, things are really nice.  You can remove all the noise for invalid data.  No more scrubbing data, or administrating malicous activity, unless you love viagra and xxx embedded content everywhere, it's a pretty good thing.  The end user doesn't even know it's there aside from a little "privacy terms" div in the bottom right corner of your page.

There are a couple out there, but I really enjoyed using google's recaptcha probably the best.  Concept is simple client side:

1. sign up for recaptcha with google, this will get you a private and public key
2. drop their recaptcha script into your site (it's on google's CDN)
3. create a simple callback function in javascript
4. augment your submit button with their attributes for the recaptcha

Now on the server side, it's pretty simple as well.  Heck it's one step.

1. validate the response code by hitting google's service

You'll get a new attribute in your payload named "g-recaptcha-response", which you'll send along with your private key to a service google has setup and it will respond with whether or not the request is legit.  It's important that this is server to server so that it is not subject to client side vulnerabilities.  There's even an angular component for it too if you want to drop it into your single page app. 

To see this in action, just jump on over to barrel proof apps, click "learn more" and then "contact" to fill out a form with invisible captcha.  As soon as I implemented it, all sorts of noise went away from my sites.  It's pretty solid and a nice solution for both users and the business.

If you are interested in learning more or want to understand how Barrel Proof Apps can assist you with a web app, please contact us at http://barrelproofapps.com or send an email to info@barrelproofapps.com.