一个验证码检查代码

引入的jar包:




验证码代码:

01_image.jsp

<%@ page language="java" pageEncoding="UTF-8"%>
<%@ page contentType="image/jpeg"  import="java.awt.*,java.awt.image.*,java.util.*,javax.imageio.*" %>
<%!
	public Color getColor(){
		Random random = new Random();
		int r = random.nextInt(256);//0-255
		int g = random.nextInt(256);
		int b = random.nextInt(256);
		return new Color(r,g,b);
	}
	public String getNum(){
		String str = "";
		Random random = new Random();
		for(int i=0;i<4;i++){
			str += random.nextInt(10);//0-9
		}
		return str;
	}
%>
<%
	response.setHeader("pragma", "mo-cache");
	response.setHeader("cache-control", "no-cache");
	response.setDateHeader("expires", 0);
	
	BufferedImage image = new BufferedImage(80,30,BufferedImage.TYPE_INT_RGB);
	
	Graphics g = image.getGraphics();
	g.setColor(new Color(200,200,200));
	g.fillRect(0,0,80,30);
	
	
	for (int i = 0; i < 30; i++) {
		Random random = new Random();
		int x = random.nextInt(80);
		int y = random.nextInt(30);
		int xl = random.nextInt(x+10);
		int yl = random.nextInt(y+10);
		g.setColor(getColor());
		g.drawLine(x, y, x + xl, y + yl);
	}
	
	
	g.setFont(new Font("serif", Font.BOLD,16));
	g.setColor(Color.BLACK);
	String checkNum = getNum();//"2525"
	
	StringBuffer sb = new StringBuffer();
	for(int i=0;i<checkNum.length();i++){
		sb.append(checkNum.charAt(i)+" ");//"2 5 2 5"
	}
	g.drawString(sb.toString(),15,20);
	
	session.setAttribute("CHECKNUM",checkNum);//2525
	
	ImageIO.write(image,"jpeg",response.getOutputStream());
	out.clear();
	out = pageContext.pushBody();
%>

效果:

验证码检查:

02_checkcode.jsp

<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>验证码检查</title>
    <script type="text/javascript" src="js/ajax.js"></script>
  </head>
  <body>
	
	<form>
		<table border="0" align="center">
			<tr>
				<th>验证码:</th>
				<td><input size="2" type="text" name="checkcode" id="checkcodeID" maxlength="4"/></td>
				<!-- img标签的src可以是图片也可以是图片文件页面 -->
				<td><img src="01_image.jsp"/>
				<td id="res"></td>
			</tr>
		</table>
	</form>
	
	<script type="text/javascript">
		//去掉二边的空格
		function trim(str){"  zhaojun  "
			str = str.replace(/^\s*/,"");//"zhaojun  " 	
			str = str.replace(/\s*$/,"");//"zhaojun"
			return str; 	
		}
	</script>
	
	<script type="text/javascript">
		document.getElementById("checkcodeID").onkeyup = function(){
			var checkcode = this.value;
			checkcode = trim(checkcode);//2525
			if(checkcode.length == 4){
				//NO1)
				var ajax = createAJAX();
				//NO2)
				var method = "POST";
				var url = "${pageContext.request.contextPath}/checkRequest?time="+new Date().getTime();
				ajax.open(method,url);
				//NO3)
				ajax.setRequestHeader("content-type","application/x-www-form-urlencoded");
				//NO4)
				var content = "checkcode=" + checkcode;
				ajax.send(content);
			
				//--------------------------------------------------------等待
				
				//NO5)
				ajax.onreadystatechange = function(){
					if(ajax.readyState == 4){
						if(ajax.status == 200){
							//NO6)
							var tip = ajax.responseText;
							
							//NO7)
							var img = document.createElement("img");
							img.src = tip;
							img.style.width = "14px";
							img.style.height = "14px";
							var td = document.getElementById("res");
							td.innerHTML = "";
							td.appendChild(img);
						}
					}
				}
			}else{
				//清空图片
				var td = document.getElementById("res");
				td.innerHTML = "";
			}
		}
	</script>	
  </body>
</html>

struts.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
    "http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>

	<package name="myPackage" extends="json-default" namespace="/">
		
		<!-- 全局结果类型 -->
		<global-results>
			<result name="success" type="json"/>
		</global-results>
		
		<action 
			name="checkRequest" 
			class="cn.itcast.javaee.js.checkcode.CheckcodeAction" 
			method="check">
		</action>
	</package>

</struts>	

CheckcodeAction.java

package cn.itcast.javaee.js.checkcode;

import java.io.PrintWriter;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionContext;
import com.opensymphony.xwork2.ActionSupport;

/**
 * 验证码检查
 * @author AdminTC
 */
public class CheckcodeAction extends ActionSupport{
	//客户端验证码
	private String checkcode;//2525
	//注入客户端验证码
	public void setCheckcode(String checkcode) {
		this.checkcode = checkcode;
	}
	/**
	 * 验证
	 */	
	public String check() throws Exception {
		//图片路径
		String tip = "images/MsgError.gif";//路径从后端传到JSP页面
		//从服务器获取session中的验证码
		String checkcodeServer = (String) ActionContext.getContext().getSession().get("CHECKNUM");
		//将客户端的验证码与服务端的验证码进行比较
		if(checkcode.equals(checkcodeServer)){
			tip = "images/MsgSent.gif";
		}
		//以IO流的方式将tip变量的值输出到AJAX异步对象中
		HttpServletResponse response = ServletActionContext.getResponse();
		response.setContentType("text/html;charset=UTF-8");
		PrintWriter pw = response.getWriter();
		pw.write(tip);
		pw.flush();
		pw.close();
		//以下方式不是最好的,但可以完成AJAX异步交互
		return null;
	}
}

结果:






评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值