The Disco Blog

Back in the Age of Aquarius, hip cats could somewhat quickly knock out an account creation web page (for basically any web application) that contained a few form fields, such as account name and password to name few. Those days are gone, however, with the proliferation of various nefarious bots that annoy basically everyone except their inventors.

While automated annoying machines are not completely stoppable (much like disco music, baby!), the CAPTCHA has been helpful in at least slowing them down. As such, various CAPTCHA implementations have sprung up– JCaptcha is one such open source implementation built for Java applications; what’s more, there is a JCaptcha plug-in for Groovy’s Grails web framework.

Using the plug-in is easy too — all it takes is four hip steps.

First, you need to download and install the plug-in, which can be done by issuing the command:

%>grails install-plugin jcaptcha

After that’s complete, you’ll need to define one or more captchas in your Grails Config.groovy file– this step was a bit confusing to me at first, so let me explain. JCaptcha offers two logical types of captchas– images and sound files. Image captchas also come in different flavors. For me, I only needed one type of captcha– that being an image one, so I was able to define it like so:

jcaptchas {
 image = new GenericManageableCaptchaService(
   new GenericCaptchaEngine(
    new GimpyFactory(
     new RandomWordGenerator("abcdefghijklmnopqrstuvwxyz1234567890"),
     new ComposedWordToImage(new RandomFontGenerator(
       20, 30, [new Font("Arial", 0, 10)] as Font[]),
     new GradientBackgroundGenerator(140, 35,
       new SingleColorGenerator(Color.white),
       new SingleColorGenerator(new Color(152, 245, 255))),
     new NonLinearTextPaster(6, 6, new Color(108, 123, 139))
     )
    )
  ),
 180,
 180000)
}

There’s a lot going on there, man, but it makes sense once you figure out what’s important.

First and foremost is the RandomWordGenerator object, which essentially represents the available copasetic characters and digits captchas will contain when generated. Because it’s my bag, in mine, all letters in the alphabet are fair game; however, they are all lower case. Also too, I’ve got 10 digits represented.

The GradientBackgroundGenerator enables you to have an image with essentially two colors with a fading effect. For instance, mine fades from white to a blue-ish color (which you can see the left). The NonLinearTextPaster object allows you to declare how many characters (or digits) will appear and what color they’ll be– in my case they are gray-ish.

Note, you’ll have to import all of these trippin’ objects into your Config object; however, that’s about it– it’s boiler plate code and of course, there are other options and objects which are free to be utilized, provided you read the JCaptcha documentation. In truth, this captcha isn’t all that sophisticated and thus, advanced bots can, most likely, figure it out– in any case, you can always make these captchas more cerebral via the various objects the JCaptcha team offers.

The next step is to incorporate the captcha object into a web page. This is easily done via the jcaptcha tag, which, at its minimal usage, takes the captcha name defined in the Config object. In my case, the name is “image”.

For instance, the relevant code which shows the captcha in the image to the left is as follows:

<p><label>&nbsp;</label><jcaptcha:jpeg name="image"/></p>
<p style="padding-bottom: 0.5em;"><label>What's in the image?</label>
<input type="text" id="captcha"
       name="captcha" value=""/></p>

As you can see, there is a form input of type text, which has an id of “captcha” — this will hold the value a user presumably enters. Accordingly, the controller that the form is submitted to needs to validate the captcha. This is done by providing the JcaptchaService (which is provided via the plug-in) with the answer the user submitted, the captcha name and the session id for which the challenge was issued — i.e. the session associated with the browser when the image was viewed.

In my case, I have a closure which contains this code to verify the correct answer was issued:

if (params.captcha.equals("") ||
    !jcaptchaService.validateResponse("image", session.id, params.captcha)) {
        account.errors.reject("blank.captcha",
          "You must specify the correct characters and/or numbers in the image")
}

As you can see, the validateResponse method returns a boolean, which indicates the answer. If false is returned, then the account domain object is provided with an error, which will be displayed on the web page, allowing the person another chance to correctly get the characters and digits correct.

With the JCaptcha plug-in, implementing a virtual wall to facilitate in hampering annoying spam bots for various web forms in Grails is as easy as cake! Can you dig it?