java ajax跳转页面_Java实现图形验证码程序

能力提升-生成图形验证码

(一)动态获取图片两种方法:

1.静态HTML获取图片地址(通过JSP脚本动态更换图片路径地址)

2.动态控制器Servlet(Java的I/O流控制输出)

步骤一、

编写JSP静态获取图片地址页面:

My JSP 'index.jsp' starting page

浏览器输出:

d08265735575f3827a9f7c7bb9d05c6d.png

第二、通过Servlet控制器输出I/O流文件的形式

package com.wq.Servlet;import java.io.File;import java.io.FileInputStream;import java.io.IOException;import java.io.InputStream;import java.io.PrintWriter;import javax.servlet.ServletException;import javax.servlet.ServletOutputStream;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;@WebServlet("/demo")public class DemoSrtvlet extends HttpServlet{ /** * */ private static final long serialVersionUID = 1L; @Override protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { // 输出文字流(获取文字) //PrintWriter outPrintWriter=resp.getWriter(); //获取响应流(图片,视频,文件等字节流) ServletOutputStream os = resp.getOutputStream(); //IO流获取文件,getRealPath(arg0)获取文件具体路径;;File(getServletContext().getRealPath(""),"ea111ec9e85c9a06f7756b488bfaae60.jpg"));//文件路径+文件名 InputStream iStream=new FileInputStream(new File(getServletContext().getRealPath("images"),"ea111ec9e85c9a06f7756b488bfaae60.jpg")); //输入流转输出流(JavaSE I/O的时候必须会写的代码) int index=-1; while((index=iStream.read())!=-1){ //index读取文件流直到等于-1 os.write(index); //同时写入到http中--os.write(index); } }}

浏览器输出:文件的形式

2f9290cc7a75a684bc7174044870eec8.png

JSP获取src路径文件

My JSP 'index.jsp' starting page

浏览器输出;(效果一样)

0aa25c6670373247743ce09327a7c987.png

实现步骤

一、实现原理

public class BufferedImage

extends Image

implements WritableRenderedImage, Transparency所述BufferedImage亚类描述了一种Image与图像数据的访问的缓冲器。 A BufferedImage由图像数据的ColorModel和Raster组成。 SampleModel中SampleModel中的Raster的数量和类型必须与ColorModel所要求的数字和类型相匹配,以表示其颜色和Alpha组件。 所有BufferedImage对象的左上角坐标为(0,0)。 Raster用于构建BufferedImage的任何BufferedImage必须具有minX = 0和minY = 0。

这个类依赖的数据获取和设置方法Raster ,并在颜色表征方法ColorModel 。

JavaWeb Jquery Ajax实现验证码局部刷新和校验

一:设置JSP页面

(1):给form表单中的 "登录" 按钮设置onsubmit验证点击后调用checkCode()返回结果为true页面跳转,为false页面不跳转。

(2):通过标签设置当点击"看不清?"时调用flushImage();进 行验局部证码刷新。

(3):点击注册按钮转发到"register.jsp"页面。

登录页面

用户名: 密码: 验证码: 看不清?

二:制作验证码

(1)制作java验证码并把产生的验证码字符串存储在

(2)request.getSession().setAttribute("code", str);存储在session中。

(3)利用ImageIO.write(image, "png", out);把图片返回给ajax的回调函数。

else if("/image.do".equals(path)) {//生成验证码 //避免浏览器缓存 response.addHeader("Pragma", "No-cache"); response.setHeader("Cache-Control", "no-cache"); response.setDateHeader("Expires", 0); //1.动态的创建一个图片 //第一个参数高度 第二个参数高度 第三个参数图片类型RGB BufferedImage image = new BufferedImage(100, 30, BufferedImage.TYPE_INT_RGB); //2.在图片上画字符 Graphics graphics = image.getGraphics(); graphics.setColor(Color.white);//改变图片背景色默认黑色 graphics.fillRect(0, 0, 100, 30);//画矩形 String str = ""; Random rand = new Random(); Font font = new Font(null,Font.BOLD,20); for (int i = 0; i < 5; i++) { int index = rand.nextInt(chars.length); Color color = new Color(rand.nextInt(255),rand.nextInt(255),rand.nextInt(255)); //生成一个随机颜色字符 graphics.setColor(color); graphics.setFont(font); graphics.drawString(chars[index]+"", 30+i*10, 20); str+=chars[index]; } for (int i = 0; i < 4; i++) { Color color = new Color(rand.nextInt(255),rand.nextInt(255),rand.nextInt(255)); graphics.setColor(color); graphics.drawLine(rand.nextInt(100), rand.nextInt(30), rand.nextInt(100), rand.nextInt(30)); } //3.将图片上的文字保存到session中 request.getSession().setAttribute("code", str); //将图片利用response输出 OutputStream out = response.getOutputStream(); ImageIO.write(image, "png", out); }

三:创建jquery ajax请求通过Java进行校验

(1):flushImamge();通过选择器选择名字为"code"的对象,发送image.do请求调用Java程序对'"code"对象进行刷新。

(2):checkCode();通过选择器选择id为"txt_code"的对象获取参数,然后发送checeked.do请求调用Java程序进行校验,如果验证码正确活动的data为 '验证码正确' 返回true,为空或者是 "验证码错误" 就是false。

function flushInamge(){ $("#code").attr("src","image.do?r"+Math.random());//实现局部刷新 }function checkCode(){ var check = true; //获取用户输入的验证码信息 var code = $("#txt_code").val().trim(); if(code == ''){ $("#s_code").html("验证码不能为空"); return false; } //验证码不为空就进行校验 $.ajax({ url:"checked.do", type:"post", async:false, data:{"code":code}, dataType:"text", success:function(data){//data是服务器返回的消息 $("#s_code").html(data); if(data == '验证码错误'){check = false;} } }) return check;}

四:用Java对验证码进行校验

通过request.getParameter("code");获取ajax请求传递的参数,然后通过request.getSession().getAttribute("code");获取session作用域中设置的参数,

最后通过if(code.equalsIgnoreCase(scode))无视大小写对输入的验证码和生成的验证码进行匹配相同out.print("验证码正确"),不相同out.print("验证码错误");将参数返回给ajax。

else if("/checked.do".equals(path)) { //接收请求code参数 String code = request.getParameter("code"); System.out.println("code"+code); //获取session中验证码信息 String scode = (String) request.getSession().getAttribute("code"); System.out.println("scode"+scode); //比对输出 response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); if(code.equalsIgnoreCase(scode)) { System.out.println(true); out.print("验证码正确"); }else { out.print("验证码错误"); System.out.println(false); } out.close();

效果

bfc0dfbd2221e5b875b07ae38675087c.gif
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值