网站如何嵌入验证码

浏览数：188 / 时间：2015年06月09日

最近博客园的改版动作比较大，看到后台管理页面的验证码，提起了我的兴趣。点击显示的验证码，可以进入到一个专门做验证码的网站：http://captcha.com/

其中包含有java、php、.net等，几乎是全平台支持的，还有配套的教程和demo。

文末提供下载下来的java版的文件，里面有jar包，如何使用呢？想快速入手：

一：最简单的文字验证码。使用jsp方式。

在jsp页面引用：

<%@page import="botdetect.web.Captcha"%>


然后在需要验证码的地方加上:

<% 
// Adding BotDetect Captcha to the page
Captcha captcha = Captcha.load(request, "exampleCaptcha"); 
captcha.renderCaptchaMarkup(pageContext.getServletContext(), 
    pageContext.getOut());
%>

<input id="captchaCodeTextBox" type="text" name="captchaCodeTextBox" />

检测用户输入的验证码是否正确

<%
if("POST".equalsIgnoreCase(request.getMethod())){
  // validate the Captcha to check we‘re not dealing with a bot
  boolean isHuman = captcha.validate(request, 
      request.getParameter("captchaCodeTextBox"));
  if(isHuman){
    // TODO: Captcha validation passed, perform protected action
  } else {
    // TODO: Captcha validation failed, show error message
  }
}
%>

既然引入了第三方jar包，当然少不了在web.xml中配置了。

<servlet-name>BotDetect Captcha</servlet-name>
    <servlet-class>botdetect.web.http.CaptchaServlet</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>BotDetect Captcha</servlet-name>
    <url-pattern>/botdetectcaptcha</url-pattern>
</servlet-mapping>

二：使用SpringMVC方式。

对应的页面：

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="botDetect" uri="botDetect"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>BotDetect CAPTCHA Spring MVC Basic Example</title>
    <link rel="stylesheet" href="stylesheet.css" type="text/css"/>
  </head>
  <body>
    <form method="post">
      <h1>BotDetect CAPTCHA Spring MVC Basic Example</h1>
      <fieldset>
        <legend>CAPTCHA Validation</legend>
        <label for="captchaCodeTextBox" class="prompt">
            Retype the code from the picture:</label>
        <!-- Adding BotDetect Captcha to the page -->
        <botDetect:captcha id="basicExampleCaptcha"/>
        <div class="validationDiv">
          <input id="captchaCodeTextBox" type="text"
               name="captchaCodeTextBox" 
               value="${basicExample.captchaCodeTextBox}"/>
          <input type="submit" name="submit" value="Submit" />&nbsp;
          <span class="correct">${basicExample.captchaCodeCorrect}</span>
          <span class="incorrect">${basicExample.captchaCodeIncorrect}</span>
        </div>
      </fieldset>
    </form>
  </body>
</html>

页面对应的controller：

package botdetect.examples.springmvc.basic.controller;

import botdetect.examples.springmvc.basic.model.BasicExample;
import botdetect.web.Captcha;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.validation.BindException;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.mvc.SimpleFormController;

public class IndexController extends SimpleFormController {
  public IndexController(){
    setCommandClass(BasicExample.class);
  }
  
  @Override
  protected ModelAndView onSubmit(HttpServletRequest request, 
      HttpServletResponse response, Object command, BindException errors){
    BasicExample basicExample = (BasicExample)command;
    // validate the Captcha to check we‘re not dealing with a bot
    Captcha captcha = Captcha.load(request, "basicExampleCaptcha");
    boolean isHuman = captcha.validate(request, 
        basicExample.getCaptchaCodeTextBox());
    if (isHuman) {
      basicExample.setCaptchaCodeCorrect("Correct.");
      basicExample.setCaptchaCodeIncorrect("");
    } else {
      basicExample.setCaptchaCodeCorrect("");
      basicExample.setCaptchaCodeIncorrect("Incorrect!");
    }
    basicExample.setCaptchaCodeTextBox("");
    return new ModelAndView("index", "basicExample", basicExample);
  }  
}

验证码对应的bean

package botdetect.examples.springmvc.basic.model;

public class BasicExample {
  private String userCaptchaCode, captchaCodeCorrect, captchaCodeIncorrect;

  public String getCaptchaCodeTextBox() {
    return userCaptchaCode;
  }

  public void setCaptchaCodeTextBox(String userCaptchaCode) {
    this.userCaptchaCode = userCaptchaCode;
  }

  public String getCaptchaCodeCorrect() {
    return captchaCodeCorrect;
  }

  public void setCaptchaCodeCorrect(String captchaCodeCorrect) {
    this.captchaCodeCorrect = captchaCodeCorrect;
  }

  public String getCaptchaCodeIncorrect() {
    return captchaCodeIncorrect;
  }

  public void setCaptchaCodeIncorrect(String captchaCodeIncorrect) {
    this.captchaCodeIncorrect = captchaCodeIncorrect;
  }

}