前言
目前很多网页为了防止恶意注册或者登录等都使用了动态验证码的的技术,我也动手尝试了一下,实现了一个简单的验证码程序,原理也很简单:首先将26个大写字母以及26个小写字母和10个数字存在一个数组里面,然后每次随机从这些字符串中选取四个进行拼接,然后用不同的颜色进行展示,为了给验证码提供更高的安全性,再加上一些随机的线条即可。效果如下:
实现过程
1、在vali.jsp中进行后台代码的编写,代码如下:
<%@ page language="java" import="java.util.*,java.io.*,javax.imageio.ImageIO,java.awt.*,java.awt.image.*" pageEncoding="utf-8" contentType="image/jpeg"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%!
// 声明全局变量以及方法
// 有10个数字,26个大写字母,26个小写字母
private String[] ver = new String[62];
/*
* 获取四个字符
*/
private String getFourChar() {
Random random = new Random();
StringBuilder ans = new StringBuilder();
for(int i=0; i< 4; i++){
ans.append(ver[random.nextInt(62)]);
}
return ans.toString();
}
%>
<%
int count =0;
for(int i=0; i< 10; i++){
ver[count++] = "" + i;
}
for(int i=0; i< 26; i++){
ver[count++] = new Character((char)(i+97)).toString();
ver[count++] = new Character((char)(i+65)).toString();
}
//设置输出个格式
response.setContentType("image/jpeg");
//在内存中准备一个image
BufferedImage image = new BufferedImage(50,20,BufferedImage.TYPE_INT_RGB);
Graphics g = image.getGraphics();
//生成图片
g.setColor(new Color(200,200,200));
g.fillRect(0, 0, 50, 20);
//绘制干扰线
g.setColor(new Color(150,150,150));
for(int i=0;i<20;i++){
int x1 = (int)(Math.random()*50);
int y1 = (int)(Math.random()*20);
int x2 = (int)(Math.random()*50);
int y2 = (int)(Math.random()*20);
g.drawLine(x1, y1, x2, y2);
}
//随机生成四个字母和数字的组合
String newVali = getFourChar();
for(int i=0;i<4;i++){
g.setColor(new Color((int)(Math.random()*150),(int)(Math.random()*150),(int)(Math.random()*150)));
g.drawString((newVali.charAt(i)+""),8*i+10, 15);
}
g.dispose();
session = request.getSession();
session.setAttribute("vali", newVali);
//输出到浏览器=============
out.clear(); //清空缓存的内容
out=pageContext.pushBody(); //更新PageContext的out属性的内容
ImageIO.write(image,"JPEG",response.getOutputStream());
%>
2、第二步就是随便写个前端来测试一下,我们写了个register.jsp来测试,在这个文件中,img标签的src指向的就是vali.jsp文件,代码如下:
<!-- 这个是page指令 -->
<%@ page language="java" import="java.util.*,java.sql.*" pageEncoding="UTF-8" contentType="text/html; charset=utf-8"%>
<!-- 这个是脚本语句 -->
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>注册界面</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
</head>
<body>
<h5>注册</h5>
<form id="f1" action="registerc.jsp" method="POST">
用户名<input name="username" type="text" onBlur="newObject()"/><br>
密码š<input name="password" type="password"/><br>
确认密码<input name="rpassword" type="password" /><br>
电子邮箱<input name="email" type="text"/><br>
验证码<input name="vali" type="text"/>
<img id="im" src="vali.jsp" width="80" height="25"><a href="">看不清</a>
<input type="submit" value="注册 "/>
</form>
</body>
</html>
这两步做好之后部署,测试即可,但是在写这个的过程中,一开始因为vali.jsp文件中总是显示不了验证码的图片,出现了getOutputStream() has already been called for this response with root cause
的异常,后来参考了这篇博文得知由于在vali.jsp中使用了,response.getWriter()函数,而在jsp内置对象中包含out对象,在Servlet规范说明中,不能既调用response.getOutputStream()
,又调用response.getWriter()
,无论先调用哪一个,在调用第二个时候应会抛出IllegalStateException
,因为在jsp中,out变量实际上是通过response.getWriter
得到的,之前的程序中既用了response.getOutputStream
,又用了out变量,故出现以上错误。解决方案就是,在调用response.getOutputStream
之前清理一下out的缓存,更新PageContext的out属性的内容:
out.clear(); //清空缓存的内容
out=pageContext.pushBody(); //更新PageContext的out属性的内容