Integrate reCAPTCHA Into Your ColdFusion Application

While building a recent application I had the need to prevent spam form submissions in quite a few different pages.  I started to integrate the CFIMAGE tag, then had a change of mind and decided to try something new.  I have not been a huge fan of the output of the captcha features of the CFIMAGE tag.  So I decided to give reCAPTCHA a try.  This offering is much more visually appealing, has customizable colors, can speak the words, and best of all it’s a free service.  The output appears as such:

recaptcha-1

In order to integrate reCAPTCHA into your application, you will need to register at reCAPTCHA.NET and obtain your public and private keys.  Once you have those you can start writing the code for integration, which is super simple.  To display the reCAPTCHA module on our form page, simply place one line of JavaScript code in the area you need it to appear.  The JavaScript call will also pass your public key to the service:

recaptcha-2

With this code you will now see the reCAPTCHA module integrated into your form page.  The module also has some customizable features that you can use to change colors, the tab index or load up one of the available themes.  This requires a little more JavaScript you write before loading in the module:

recaptcha-3

So now that the module displays, we need to be able to process the information on our form post to validate the input.  This is super simple as well, and just involves a HTTP post call and passing them your private key, the remote user’s IP address, and the two form fields created by the display module.  The response from this call will return a “true” or “false”.  You then use that to validate whether the user submitted input matched the words that were displayed.

And that’s it.  I hope you see how easy integration is and in my opinion is a much better visually appealing interface than using the CFIMAGE captcha features.

Comments

comments powered by Disqus