验证码 ajax java_Java、Servlet、JSP和Ajax实现验证码

环境：

windows7,MyEclipse 9

首先是写生成验证图片的类:

1 packagecn.com.leamon.util;2

3 importjava.awt.Color;4 importjava.awt.Font;5 importjava.awt.Graphics2D;6 importjava.awt.image.BufferedImage;7 importjava.io.IOException;8 importjava.util.Random;9

10 importjavax.servlet.ServletException;11 importjavax.servlet.ServletOutputStream;12 importjavax.servlet.http.HttpServlet;13 importjavax.servlet.http.HttpServletRequest;14 importjavax.servlet.http.HttpServletResponse;15 importjavax.servlet.http.HttpSession;16

17 importcom.sun.image.codec.jpeg.JPEGCodec;18 importcom.sun.image.codec.jpeg.JPEGImageEncoder;19

20 public class IdenCode extendsHttpServlet {21 /**

22 *23 */

24 private static final long serialVersionUID = 1L;25

26 public static final char[] CHARS = { '1', '2', '3', '4', '5', '6', '7',27 '8', '9', '0', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J',28 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W',29 'X', 'Y', 'Z', };30 public static Random random = newRandom();31

32 public staticString getRandomString(HttpServletRequest request) {33 StringBuffer buffer = newStringBuffer();34 for (int i = 0; i < 9; i++) {35 buffer.append(CHARS[random.nextInt(CHARS.length)]);36 }37 System.out.println(buffer.toString());38 HttpSession session = request.getSession();39 session.setAttribute("code", buffer.toString());40 returnbuffer.toString();41 }42

43 public staticColor getRandomColor() {44 return new Color(random.nextInt(255), random.nextInt(255),45 random.nextInt(255));46 }47

48 public staticColor getReverseColor(Color c) {49 return new Color(255 - c.getRed(), 255 -c.getGreen(),50 255 -c.getBlue());51 }52

53 public voiddoGet(HttpServletRequest request, HttpServletResponse response)54 throwsServletException, IOException {55 response.setContentType("image/jpeg");56 String radomString =getRandomString(request);57 request.getSession(true).setAttribute("radomString", radomString);58 Color color =getRandomColor();59 Color reverse =getReverseColor(color);60 BufferedImage bi = new BufferedImage(100, 30,61 BufferedImage.TYPE_INT_RGB);62 Graphics2D g =bi.createGraphics();63 g.setFont(new Font(Font.SANS_SERIF, Font.BOLD, 16));64 g.setColor(color);65 g.fillRect(0, 0, 100, 30);66 g.setColor(reverse);67 g.drawString(radomString, 5, 20);68 for (int i = 0, n = random.nextInt(100); i < n; i++) {69 g.drawRect(random.nextInt(100), random.nextInt(30), 1, 1);70 }71 ServletOutputStream out =response.getOutputStream();72 JPEGImageEncoder encoder =JPEGCodec.createJPEGEncoder(out);73 encoder.encode(bi);74 out.flush();75 }76 }

这个类无需自己会写，只要会用就行。关键的两行我加了红色。这两行代码是将生成的验证码放入session。便于后来与用户输入的验证码进行比对，从而判断用户输入是否正确。

静态页面简单写写就行。

1

2

3 String path =request.getContextPath();4 String basePath = request.getScheme() + "://"

5 + request.getServerName() + ":" +request.getServerPort()6 + path + "/";7 %>

8

9

10

11

12

13

14 $(function(){15 $("#btn").click(function(){16 var code = $("#input_checkCode").val();17 $.post(18 "checkCode",19 {"input_checkCode":code},20 function(data){21 $("#tips").html("验证码输入成功");22 }23 );24 });25 });26

27

28

29

30

31 验证码:32

33

34 οnclick="document.getElementById('num').src= 'getCode?time='+(new Date()).getTime();">

35

36

37 οnclick="document.getElementById('num').src= 'getCode?time='+(new Date()).getTime();">看不清换一张

38

39

40

41

42

43

关键代码加了颜色。绑定点击事件，传一个时间参数(不传的话验证码不会改变,"欺骗")。

有了请求之后需要写一个action去处理请求:

packagecn.com.leamon.action;importjava.io.IOException;importjava.io.PrintWriter;importjavax.servlet.ServletException;importjavax.servlet.http.HttpServlet;importjavax.servlet.http.HttpServletRequest;importjavax.servlet.http.HttpServletResponse;importjavax.servlet.http.HttpSession;public class CheckCodeAction extendsHttpServlet {/*** @Fields serialVersionUID : TODO(用一句话描述这个变量表示什么)*/

private static final long serialVersionUID = 1653887824692213635L;

@Overrideprotected voidservice(HttpServletRequest request,

HttpServletResponse response)throwsServletException, IOException {

PrintWriter out=response.getWriter();

String checkCode= request.getParameter("input_checkCode");//获取用户输入的验证码

HttpSession session=request.getSession();

String code1= (String) session.getAttribute("code");//获取系统生成的验证码

System.out.println("用户输入:" +checkCode);

System.out.println("系统生成:" +code1);

System.out.println(checkCode.equalsIgnoreCase(code1));//不区分大小写 去验证两者是否相等if(checkCode.equalsIgnoreCase(code1)) {

out.print("验证码填写正确");

}

}

}

里面加了一些输出语句，方便测试。

最后是配置web.xml

http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">

index.jsp

servlet

cn.com.leamon.util.IdenCode

servlet

/getCode

servlet1

cn.com.leamon.action.CheckCodeAction

servlet1

/checkCode

这配置也没啥说的。基础配置。

效果图如下：

效果如上图。

输入错误的时候没有做处理，各位看官可根据自己需要处理。

有什么需要指正和讨论，请联系QQ：70747053或邮箱：leamon@yeah.net