ajax检查验证码原理,ajax验证码检测-优快云博客

1、验证码文件

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

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文件

验证码检查

验证码：

//去掉二边的空格

function trim(str){" zhaojun "

str = str.replace(/^\s*/,"");//"zhaojun "

str = str.replace(/\s*$/,"");//"zhaojun"

return str;

}

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 = "";

}

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文件

name="checkRequest"

class="cn.itcast.javaee.js.checkcode.CheckcodeAction"

method="check">

Ajax提交表单时验证码自动验证 php后端验证码检测

本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.html &l ...

Struts2+Ajax实现检测用户名是否唯一

搞了慢慢两天,终于弄明白了怎么在Struts2框架中使用Ajax检测用户名的存在了.虽然,比起那些大牛们来,这速度确实够慢的,不过,最终弄出来还是满满的成就感啊. 闲话休提,言归正传.直接上代码: A ...

【05】AJAX实例-检测用户名是否存在(实例)

AJAX实例-检测用户名是否存在用户注册时,需要填写个人信息,其中包括用户名.当用户输入完成时,JavaScript 需要及时检测用户名是否存在,如果存在给出提示,请用户更换用户名. 当然,这个 ...

AJAX验证码检查

前言对于验证码检查我们并不会陌生,我们在学习Session的时候已经使用过了验证码检查了.详细可参考:http://blog.youkuaiyun.com/hon_3y/article/details/5479 ...

利用jQuery和Ajax实现检测用户名是否已经被注册

这是一个jQuery和Ajax的很基础的应用,是我出去面试时的一个面试题.当时脑子有点懵想了好久才知道该怎么去实现,现在回来再看了下书好好总结一下这个东西. 首先新建一个html文件,只有简单的几行代 ...

Ajax实现提交表单时验证码自动验证(原创自Zjmainstay)

本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.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(); 上面 ...

随机推荐

[每日一记] Python报错 IndentationError&colon; unexpected indent

IndentationError: unexpected indent 代码缩进出现错误今天这个报错的原因是,早些时候的代码里Tab和空格混起来用了,,,[不是我...是编辑器的锅不过我已经把Su ...

Bootstrap分为几部分？

Bootstrap分为五部分: (1)起步(Startup) (2)全局CSS样式(Global CSS) (3)组件(Component) (4)插件(Plugin) (5)定制(Customize ...

java&lowbar; 集合

集合类说明及区别Collection├List│├LinkedList│├ArrayList│└Vector│ └Stack└SetMap├Hashtable├HashMap└WeakHashMap ...

HI3531ARM调试printf的实现

void UART_Putc(char c) { if (c == '\n') *(unsigned int *)(UART0_ADDR + 0X00) = '\r'; del ...

java进阶系列之装饰器模式

1.介绍装饰器模式顾名思义就是装饰某个对象的,是一种结构型模式.装饰器模式允许向一个现有对象添加新的功能,同时不改变其结构,用户可以随意的扩展原有的对象.它是作为现有的类的一个包装.装饰器模式一方面 ...

Bootstrap3基础 list-inline 无序列表横向显示

内容参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...

Linux&lowbar;(2)基本命令(下)

六.文件搜索命令11 :which功能描述:显示系统命令所在目录命令所在路径:/usr/bin/which执行权限:所有用户语法:which [命令名称]范例:$ which ls 12 :find功 ...

使用NPOI将数据导出Excel

NPOI.HSSF.UserModel.HSSFWorkbook book = new NPOI.HSSF.UserModel.HSSFWorkbook(); NPOI.SS.UserModel.IS ...

Asp&period;net MVC3中全局图片防盗链

怎么样在Asp.Net MVC3中做到全局图片防盗链?如果熟悉Asp.Net的页面生命周期,相信解决这个问题应该很容易.下面就演示一下如何去做? 一.首先是全局的,我们肯定要在Global.asax文 ...

cassandra根据用户名密码登录cqlsh

修改conf目录下cassandra.yaml文件 authenticator: PasswordAuthenticator //将authenticator修改为PasswordAuthentic ...