JSF Basic CAPTCHA Code Example

The JSF Basic Captcha code example shows the most basic source code required to protect a JSF form with BotDetect CAPTCHA and validate the user input.

It can be used as a starting point when you are getting started with BotDetect.

Download the BotDetect Java CAPTCHA Generator archive to run this example

JavaServer Faces 2.0+
JavaServer Faces 1.2

JSF 2.0+

Within this page, the root folder of the extracted archive is referred as the <BDC-DIR>.

This example is in the <BDC-DIR>/examples/t_api-captcha-jsf2.0-api_basics-jsp_view/ folder; and contains the following files:

index.jsp
WEB-INF/src/com/captcha/botdetect/examples/jsf/basic_captcha/view/BasicCaptcha.java
WEB-INF/web.xml

Running Example

This example's war file (in BotDetect download package) already embeds all dependencies.

In case you are making this example from scratch in your IDE, you need to ensure botdetect.jar, botdetect-servlet.jar, botdetect-jsp20.jar, and botdetect-jsf20.jar are in the classpath.

index.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@taglib prefix="botDetect" uri="https://captcha.com/java/jsf"%>
<!DOCTYPE HTML>
<f:view>
  <html>
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
      <title>BotDetect Java CAPTCHA Validation: JSF Basic CAPTCHA Code Example</title>
      <link rel="stylesheet" href="stylesheet.css" type="text/css"/>
    </head>
    <body>
      <h:form prependId="false" styleClass="column">
        <h1>BotDetect Java CAPTCHA Validation:<br> JSF Basic CAPTCHA Code Example</h1>
        <fieldset>
          <legend>Java CAPTCHA validation</legend>
          <h:outputLabel for="captchaCode" value="Retype the characters from the picture:"/>
          
          <!-- Adding BotDetect Captcha to the page -->
          <botDetect:jsfCaptcha id="basicExampleCaptcha"
              userInputID="captchaCode"
              binding="#{jsfBasicCaptchaExample.captcha}" />
          
          <div class="validationDiv">
            <h:inputText id="captchaCode" value="#{jsfBasicCaptchaExample.captchaCode}"/>
            <h:commandButton action="#{jsfBasicCaptchaExample.validate}" value="Validate"/>
            <h:outputText value="Correct code" styleClass="correct" rendered="#{jsfBasicCaptchaExample.correctLabelVisible}"/>
            <h:outputText value="Incorrect code" styleClass="incorrect" rendered="#{jsfBasicCaptchaExample.incorrectLabelVisible}"/>
          </div>
        </fieldset>
      </h:form>
    </body>
  </html>
</f:view>

BotDetect custom JsfCaptcha tag generates the Html markup required to show the Captcha image and the Captcha sound / reload buttons.

[back to the top of the page]

BasicCaptcha.java

package com.captcha.botdetect.examples.jsf.basic_captcha.view;

import com.captcha.botdetect.CodeStyle;
import com.captcha.botdetect.web.jsf.JsfCaptcha;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

@ManagedBean(name="jsfBasicCaptchaExample")
@RequestScoped
public class BasicCaptcha {

  private String captchaCode;
  private JsfCaptcha captcha;
  private boolean correctLabelVisible, incorrectLabelVisible;

  public BasicCaptcha() {
    this.captcha = new JsfCaptcha();
    captcha.setCodeStyle(CodeStyle.NUMERIC.name());
  }

  public String getCaptchaCode() {
    return captchaCode;
  }

  public void setCaptchaCode(String captchaCode) {
    this.captchaCode = captchaCode;
  }

  public JsfCaptcha getCaptcha() {
    return captcha;
  }

  public void setCaptcha(JsfCaptcha captcha) {
    this.captcha = captcha;
  }

  public boolean isCorrectLabelVisible() {
    return correctLabelVisible;
  }

  public boolean isIncorrectLabelVisible() {
    return incorrectLabelVisible;
  }


  public void validate(){
    // validate the Captcha to check we're not dealing with a bot
    boolean isHuman = captcha.validate(captchaCode);
    if (isHuman) {
      correctLabelVisible = true;
      incorrectLabelVisible = false;
    } else {
      correctLabelVisible = false;
      incorrectLabelVisible = true;
    }
    this.captchaCode = "";
  }

}

Binding JsfCaptcha tag from JSF form with backing bean property allows us to dynamically set Captcha properties and to perform Captcha validation in backing bean's form action method.

[back to the top of the page]

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xmlns="http://java.sun.com/xml/ns/javaee" 
    xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
  xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
  http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
  id="WebApp_ID" version="2.5">

  <display-name>JavaServerFaces</display-name>

  <context-param>
    <param-name>javax.faces.PROJECT_STAGE</param-name>
    <param-value>Development</param-value>
  </context-param>

  <context-param>
    <param-name>javax.faces.DEFAULT_SUFFIX</param-name>
    <param-value>.jsp</param-value>
  </context-param>

  <context-param>
    <param-name>facelets.VIEW_MAPPINGS</param-name>
    <param-value>*.xhtml</param-value>
  </context-param>     
 
  <context-param>
    <param-name>javax.faces.VALIDATE_EMPTY_FIELDS</param-name> 
    <param-value>true</param-value>
  </context-param>    

  <servlet>
    <servlet-name>Faces Servlet</servlet-name>
    <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
  </servlet>

  <servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>/faces/*</url-pattern>
  </servlet-mapping>
  <servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>*.faces</url-pattern>
  </servlet-mapping>

  <servlet>
    <servlet-name>BotDetect Captcha</servlet-name>
    <servlet-class>com.captcha.botdetect.web.servlet.CaptchaServlet</servlet-class>
  </servlet>    
  <servlet-mapping>
    <servlet-name>BotDetect Captcha</servlet-name>
    <url-pattern>/botdetectcaptcha</url-pattern>
  </servlet-mapping> 
  
  <welcome-file-list>
    <welcome-file>faces/index.jsp</welcome-file>
  </welcome-file-list>
  
  
  <session-config>
    <session-timeout>
      30
    </session-timeout>
  </session-config>
</web-app>

In WEB-INF/web.xml file we register CaptchaServlet used for BotDetect Captcha requests.

[back to the top of the page]

JSF 1.2

The JSF 1.2 Basic CAPTCHA code example is included in the
examples/traditional-api/bdc4-traditional-api-jsf12-basic-captcha-example.war file of the download package.

[back to the top of the page]

Please Note

BotDetect Java Captcha Library v4.0.Beta3.7 is an in-progress port of BotDetect 4 Captcha, and we need you to guide our efforts towards a polished product. Please let us know if you encounter any bugs, implementation issues, or a usage scenario you would like to discuss.