ajax验证码检测
1、验证码文件
<%@ 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();
%>
2、验证HTML文件
<%@ 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>
<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>
3、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";
//从服务器获取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;
}
}
4、struts文件
<action
name="checkRequest"
class="cn.itcast.javaee.js.checkcode.CheckcodeAction"
method="check">
</action>
ajax验证码检测的更多相关文章
- Ajax提交表单时验证码自动验证 php后端验证码检测
本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.html <!DOCTYPE html> <html> &l ...
- Struts2+Ajax实现检测用户名是否唯一
搞了慢慢两天,终于弄明白了怎么在Struts2框架中使用Ajax检测用户名的存在了.虽然,比起那些大牛们来,这速度确实够慢的,不过,最终弄出来还是满满的成就感啊. 闲话休提,言归正传.直接上代码: A ...
- 【05】AJAX实例-检测用户名是否存在（实例）
AJAX实例-检测用户名是否存在 用户注册时,需要填写个人信息,其中包括用户名.当用户输入完成时,JavaScript 需要及时检测用户名是否存在,如果存在给出提示,请用户更换用户名. 当然,这个 ...
- AJAX验证码检查
前言 对于验证码检查我们并不会陌生,我们在学习Session的时候已经使用过了验证码检查了.详细可参考:http://blog.csdn.net/hon_3y/article/details/5479 ...
- 利用jQuery和Ajax实现检测用户名是否已经被注册
这是一个jQuery和Ajax的很基础的应用,是我出去面试时的一个面试题.当时脑子有点懵想了好久才知道该怎么去实现,现在回来再看了下书好好总结一下这个东西. 首先新建一个html文件,只有简单的几行代 ...
- Ajax实现提交表单时验证码自动验证（原创自Zjmainstay）
本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.html <!DOCTYPE html> <html> &l ...
- Ajax【介绍、入门、解决Ajax中文、跨域、缓存】
什么是Ajax Ajax(Asynchronous JavaScript and XML) 异步JavaScript和XML Ajax实际上是下面这几种技术的融合: (1)XHTML和CSS的基于标准 ...
- AJAX入门第一篇就够了
什么是Ajax Ajax(Asynchronous JavaScript and XML) 异步JavaScript和XML Ajax实际上是下面这几种技术的融合: (1)XHTML和CSS的基于标准 ...
- ThinkPHP框架之验证码
Think\Verify类可以支持验证码的生成和验证功能. 下面是最简单的方式生成验证码: $Verify = new \Think\Verify(); $Verify->entry(); 上面 ...
随机推荐
- TF卡速度测试对比 Class数越高速度越快
存储卡(TF卡)是手机扩展存储的大杀器,让你多装n部学习资料,多装n个外语听力练习.除了装东西外,存储卡性能不佳也会影响手机的整体性能以及体验的.本文主要针对Android手机,我是懒人,但我讨厌懒人 ...
- 一个大小为N的数组，里面是N个整数，怎样去除重复的数
题目:一个大小为N的数组,里面是N个整数,怎样去除重复的数字: 要求时间复杂度为O(n),空间复杂度为O(1). 需要除掉重复的整数的数组,注意这里我没有处理负数情况,其实负数情况只要先用0快排分一下 ...
- java 一致性哈希类实例 算法
package com.hash; import java.util.Collection; import java.util.SortedMap; import java.util.TreeMap; ...
- uvalive5810 uva12368 Candles
题意:每组数据给出n个数,每个数在1-100,问组成这些数的蜡烛的权值的最小值.权值=把选的蜡烛从大到小排列组成的数 组成方式:比如有1 3两个蜡烛 可以组成13(1和3)或4(1+3) 只有一个加号 ...
- C函数数组元素初始化
初始化时,可随意指定初始化的元素或者元素的范围. 附gnu c 手册. http://www.gnu.org/software/gnu-c-manual/gnu-c-manual.html 代码: t ...
- c++链接数据库测试，中文有问题
#include <stdio.h> #include <stdlib.h> #include <string.h> #include <Windows.h& ...
- 链表-Reverse Linked List II
[题目要求直接翻转链表,而非申请新的空间] 这道题的一个关键在于,当m=1时,需要翻转的链表段前没有其他的结点(leetcode的测试用例不含头结点),这个特例给解题带来了一点小小的困难.一个比较直观 ...
- Android数据的四种存储方式SharedPreferences、SQLite、Content Provider和File （三） —— SharePreferences
除了SQLite数据库外,SharedPreferences也是一种轻型的数据存储方式,它的本质是基于XML文件存储key-value键值对数据,通常用来存储一些简单的配置信息.其存储位置在/data ...
- 经典SQL语句集锦
下列语句部分是MsSql语句,不可以在access中使用. SQL分类: DDL—数据定义语言(CREATE,ALTER,DROP,DECLARE) DML—数据操纵语言(SELECT,DELET ...
- JS脚本验证大全
/** * 2009-10-01 * 贺 臣 * 情 缘 * js各种表单数据验证 *//***************************************************** ...