环境:
windows7,MyEclipse 9
首先是写生成验证图片的类:
1 package cn.com.leamon.util; 2 3 import java.awt.Color; 4 import java.awt.Font; 5 import java.awt.Graphics2D; 6 import java.awt.image.BufferedImage; 7 import java.io.IOException; 8 import java.util.Random; 9 10 import javax.servlet.ServletException; 11 import javax.servlet.ServletOutputStream; 12 import javax.servlet.http.HttpServlet; 13 import javax.servlet.http.HttpServletRequest; 14 import javax.servlet.http.HttpServletResponse; 15 import javax.servlet.http.HttpSession; 16 17 import com.sun.image.codec.jpeg.JPEGCodec; 18 import com.sun.image.codec.jpeg.JPEGImageEncoder; 19 20 public class IdenCode extends HttpServlet { 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 = new Random(); 31 32 public static String getRandomString(HttpServletRequest request) { 33 StringBuffer buffer = new StringBuffer(); 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 return buffer.toString(); 41 } 42 43 public static Color getRandomColor() { 44 return new Color(random.nextInt(255), random.nextInt(255), 45 random.nextInt(255)); 46 } 47 48 public static Color getReverseColor(Color c) { 49 return new Color(255 - c.getRed(), 255 - c.getGreen(), 50 255 - c.getBlue()); 51 } 52 53 public void doGet(HttpServletRequest request, HttpServletResponse response) 54 throws ServletException, 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 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 2 <% 3 String path = request.getContextPath(); 4 String basePath = request.getScheme() + "://" 5 + request.getServerName() + ":" + request.getServerPort() 6 + path + "/"; 7 %> 8 9 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 10 <html> 11 <head> 12 <script type="text/javascript" src="js/jquery-1.6.js"></script> 13 <script type="text/javascript"> 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 </script> 27 </head> 28 29 <body> 30 <form action="checkCode"> 31 验证码: 32 <input type="text" id="input_checkCode" name="input_checkCode"> 33 <a href="javascript:;" 34 onclick="document.getElementById('num').src= 'getCode?time='+(new Date()).getTime();"> 35 <img alt="验证码" src="getCode" id="num"> </a> 36 <a href="javascript:;" 37 onclick="document.getElementById('num').src= 'getCode?time='+(new Date()).getTime();">看不清换一张</a> 38 <br/> 39 <input type="button" value="确定提交" id="btn"> 40 <span style="color:red;font-size:14px" id="tips"></span> 41 </form> 42 </body> 43 </html>
关键代码加了颜色。绑定点击事件,传一个时间参数(不传的话验证码不会改变,"欺骗")。
有了请求之后需要写一个action去处理请求:
package cn.com.leamon.action; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; public class CheckCodeAction extends HttpServlet { /** * @Fields serialVersionUID : TODO(用一句话描述这个变量表示什么) */ private static final long serialVersionUID = 1653887824692213635L; @Override protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, 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
<?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <display-name></display-name> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> <servlet> <servlet-name>servlet</servlet-name> <servlet-class>cn.com.leamon.util.IdenCode</servlet-class> </servlet> <servlet-mapping> <servlet-name>servlet</servlet-name> <url-pattern>/getCode</url-pattern> </servlet-mapping> <servlet> <servlet-name>servlet1</servlet-name> <servlet-class>cn.com.leamon.action.CheckCodeAction</servlet-class> </servlet> <servlet-mapping> <servlet-name>servlet1</servlet-name> <url-pattern>/checkCode</url-pattern> </servlet-mapping> </web-app>
这配置也没啥说的。基础配置。
效果图如下:
效果如上图。
输入错误的时候没有做处理,各位看官可根据自己需要处理。
此文章由 http://www.ositren.com 收集整理 ,地址为: http://www.ositren.com/htmls/69109.html