这里用到的是itcast-tool jar包（传智播客的工具包）实现的图片验证码。
1.编写jsp页面
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>登录页面</title>
<script type="text/javascript">
function another(){
/*
1. 获取<img>元素
2.给他的src指向为/verifyCode/VerifyCodeServlet
*/
var img = document.getElementById("imgVerifyCode");
img.src="/verifyCode/VerifyCodeServlet?a="+new Date().getTime();
//如果不加上参数a的话，浏览器一般都有缓存。点击换一张就起不到效果。
}
</script>
</head>
<body>
<!--
1.写表单，其中包含验证码
2.让图片显示出验证码
把<img>的src指向verityCodeServlet，jar中以写好，只需在web.xml中配置好。
-->
<form action="/verifyCode/LoginServlet" method="post">
用户名：<input type="text" name="username"/><br/>
密 码：<input type="password" name="password"/><br/>
验证码：<input type="text" name="verifyCode"/><br/>
<img src="/verifyCode/VerifyCodeServlet" id="imgVerifyCode"/><a href="javascript:another()">看不清，换一张</a><br/>
<!-- img src="/项目名/web.xml配置的信息名" -->
<input type="submit" value="提交">
</form>
</body>
</html>
在超链接那里，有人说为啥不直接刷新不用那么麻烦。但是写程序必须考虑到用户体验，如果用户刚好填好信息，一点把刚刚填好的资料清空了，那就得不偿失了。
2.配置web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<servlet>
<servlet-name>VerifyCodeServlet</servlet-name>
<servlet-class>cn.itcast.vcode.servlet.VerifyCodeServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>VerifyCodeServlet</servlet-name>
<url-pattern>/VerifyCodeServlet</url-pattern>
</servlet-mapping>
</web-app>
效果图：
itcast-tools-1.4.jar中验证码源码部分：
VerifyCode.java
public class VerifyCode {
private int w = 70;
private int h = 35;
private Random r = new Random();
// {"宋体", "华文楷体", "黑体", "华文新魏", "华文隶书", "微软雅黑", "楷体_GB2312"}
private String[] fontNames = {"宋体", "华文楷体", "黑体", "微软雅黑", "楷体_GB2312"};
private String codes = "23456789abcdefghjkmnopqrstuvwxyzABCDEFGHJKMNPQRSTUVWXYZ";
private Color bgColor = new Color(255, 255, 255);
private String text ;
private Color randomColor () {
int red = r.nextInt(150);
int green = r.nextInt(150);
int blue = r.nextInt(150);
return new Color(red, green, blue);
}
private Font randomFont () {
int index = r.nextInt(fontNames.length);
String fontName = fontNames[index];
int style = r.nextInt(4);
int size = r.nextInt(5) + 24;
return new Font(fontName, style, size);
}
private void drawLine (BufferedImage image) {
int num = 3;
Graphics2D g2 = (Graphics2D)image.getGraphics();
for(int i = 0; i < num; i++) {
int x1 = r.nextInt(w);
int y1 = r.nextInt(h);
int x2 = r.nextInt(w);
int y2 = r.nextInt(h);
g2.setStroke(new BasicStroke(1.5F));
g2.setColor(Color.BLUE);
g2.drawLine(x1, y1, x2, y2);
}
}
private char randomChar () {
int index = r.nextInt(codes.length());
return codes.charAt(index);
}
private BufferedImage createImage () {
BufferedImage image = new BufferedImage(w, h, BufferedImage.TYPE_INT_RGB);
Graphics2D g2 = (Graphics2D)image.getGraphics();
g2.setColor(this.bgColor);
g2.fillRect(0, 0, w, h);
return image;
}
public BufferedImage getImage () {
BufferedImage image = createImage();
Graphics2D g2 = (Graphics2D)image.getGraphics();
StringBuilder sb = new StringBuilder();
// 向图片中画4个字符
for(int i = 0; i < 4; i++) {
String s = randomChar() + "";
sb.append(s);
float x = i * 1.0F * w / 4;
g2.setFont(randomFont());
g2.setColor(randomColor());
g2.drawString(s, x, h-5);
}
this.text = sb.toString();
drawLine(image);
return image;
}
public String getText () {
return text;
}
public static void output (BufferedImage image, OutputStream out)
throws IOException {
ImageIO.write(image, "JPEG", out);
}
}
校验功能
1.编写一个LoginServlet
public class LoginServlet extends BaseServlet {
private static final long serialVersionUID = 1L;
/*
* A进行验证码效验 a获取表单上的验证码 b获取图片上的验证码
*/
public String login(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String verifyCode = request.getParameter("verifyCode");
// VerifyCodeServlet会把真正的验证码保存到session中
String vcode = (String) request.getSession().getAttribute("vCode");
//这里的"vCode"可以看上面的源码
// System.out.println(verifyCode.equalsIgnoreCase(vcode));
PrintWriter pw = response.getWriter();
if (verifyCode.equalsIgnoreCase(vcode) == true) {
pw.write("验证码正确！");
} else {
pw.write("验证码错误！");
}
return null;
}
}
2.配置web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" version="2.5">
<servlet>
<servlet-name>VerifyCodeServlet</servlet-name>
<servlet-class>cn.itcast.vcode.servlet.VerifyCodeServlet</servlet-class>
</servlet>
<servlet>
<servlet-name>LoginServlet</servlet-name>
<servlet-class>com.servlet.LoginServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>VerifyCodeServlet</servlet-name>
<url-pattern>/VerifyCodeServlet</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>LoginServlet</servlet-name>
<url-pattern>/LoginServlet</url-pattern>
</servlet-mapping>
</web-app>
3.修改jsp页面
在form表单下添加一个隐藏文本域。
<%-- 添加一个参数：method=login --%>
<input type="hidden" name="method" value="login">
效果图：
