First of all the user who wants to use captcha service need to have a Google Account. Visit the site: reCAPTCHA website. Login into your google account. Once the reCaptcha signup form is submitted, a page will be shown saying that:

Add the HTML code as is, and then turn you head up and down, to work it in sync with the JSF view. Write a custom control which will do the part of generating the Captcha HTML for me, so I have a clean views to maintain and is easily manageable. (Winner for me :))

Get the required library for captcha integration:

Create a custom Faces Component for captcha rendering:

Adding the component in faces-config.xml

Register the control in tag in the taglib.

Register the taglib in web.xml

Activate the taglib in faces.

Create a validator to actually validate the captcha with Google API for Captcha

Create a sample test page.

<dependency>

<groupId>net.tanesha.recaptcha4j</groupId>

<artifactId>recaptcha4j</artifactId>

<version>0.0.7</version>

</dependency>





<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE facelet-taglib PUBLIC

"-//Sun Microsystems, Inc.//DTD Facelet Taglib 1.0//EN"

"http://java.sun.com/dtd/facelet-taglib_1_0.dtd">



<facelet-taglib>

<namespace>http://himanshu/jsf-custom-components/</namespace>

<tag>

<tag-name>recaptcha</tag-name>

<component>

<component-type>com.himanshu.jsf.custom.recaptcha</component-type>

</component>

</tag>

</facelet-taglib>

<context-param>

<param-name>javax.faces.FACELETS_LIBRARIES</param-name>

<param-value>/WEB-INF/marquee-taglib.xml</param-value>

</context-param>

<ui:composition xmlns="http://www.w3.org/1999/xhtml"

xmlns:h="http://java.sun.com/jsf/html"

xmlns:f="http://java.sun.com/jsf/core"

xmlns:ui="http://java.sun.com/jsf/facelets"

xmlns:customJSF="http://himanshu/jsf-custom-components/" >



<f:view>

<h:head></h:head>



<h:form id>

<customJSF:recaptcha id="rc" publicKey="abc" privateKey="xyz">



<f:validator validatorId="com.himanshu.jsf.captcha.validator" />

</customJSF:recaptcha>



<h:message for="rc" />

<h:commandButton type="submit" id="login" value="Login" action="#{helloWorld.submitForm}" />





</h:form>



</f:view>

</ui:composition>

This post is in continuation with my previous post related to custom controls. Now comes the part where I will make a practical use of my knowledge.JSF is all about rich web development. And in today'sworld to differentiate between a human and a bot is very difficult. So in order to avoid spam and unnecessary traffic comes into picture Captcha.I will start by first introducing on how to get started with Captcha:This screen shows that you have successfully setup you captcha account.Now in order to integrate captcha with your JSF-2.0 application.It is required to do atleast one of the following:So in order to begin with this integration into a JSF web-application following steps are required:So now I will take one step at a time:For maven users, simply add this dependency in your pom.xml:For non-maven users the jar is available for download here. Once the jar is included in the classpath. We are ready to move to step-2.For the same I have posted the code below in the file,Don't foget to have a look at the overriden methodI will discuss the details later once, I have written the validator.No we do not need to do it here, because the component class is already being annotated with, so no need to do in faces-config.xml. Both the approaches are alternatives of each other.Since we need to use this control as a tag inside the XHTMLs so it is required that we register the same. For this refer to, as shown in the code below.andBoth these steps can be merged into a single step, with the following tags in web.xml.We have created a custom validator which will capture the request, get the input entered in the captcha control. And will validate it using Google API for captchaBuild the application and deploy in AS.This will render the captcha control once the corresponding view is opened.Here is the sample captcha generated.But wait a minute, my validator is not getting called. Did I miss something?Now let me rollback to the point where I had to overridemethod inValidators are by default or by configuration not invoked when the value is empty. For that, either the required attribute should be used, or thecontext param should be set with a value of true.That was the case here. So overriding the validate method and calling the validator registered with the RecpatchaComponent serves the purpose here.Now we are done with developing the captcha component for JSF-2.0 and ready to integrate in our application.