首先,我们需要新建一个Servlet,这个就是单纯的视图层和控制层相互联系(没有必要研究验证码的代码,复制拿来用)
package com.bjsxt.servlet;
import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Random;
import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class RandomServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 在内存中创建图象
int width = 110, height = 30;
BufferedImage image = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
// 获取图形上下文
Graphics g = image.getGraphics();
// 生成随机类
Random random = new Random();
// 设定背景色
g.setColor(getRandColor(200, 250));
g.fillRect(0, 0, width, height);
// 设定字体
g.setFont(new Font("Times New Roman", Font.PLAIN, 20));
// 随机产生155条干扰线,使图象中的认证码不易被其它程序探测到
g.setColor(getRandColor(160, 200));
for (int i = 0; i < 155; i++) {
int x = random.nextInt(width);
int y = random.nextInt(height);
int xl = random.nextInt(12);
int yl = random.nextInt(12);
g.drawLine(x, y, x + xl, y + yl);
}
// 取随机产生的认证码(6位数字)
String sRand = "";
for (int i = 0; i < 6; i++) {
String rand = String.valueOf(random.nextInt(10));
sRand += rand;
// 将认证码显示到图象中
g.setColor(new Color(20 + random.nextInt(110), 20 + random
.nextInt(110), 20 + random.nextInt(110)));
// 调用函数出来的颜色相同,可能是因为种子太接近,所以只能直接生成
g.drawString(rand, 13 * i + 6, 16);
}
// 图象生效
g.dispose();
try {
ImageIO.write(image, "JPEG", response.getOutputStream());
} catch (Exception e) {
System.out.println("验证码图片产生出现错误:" + e.toString());
}
//保存验证码到Session
request.getSession().setAttribute("randStr", sRand);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doGet(request, response);
}
/*
* 给定范围获得随机颜色
*/
private Color getRandColor(int fc, int bc) {
Random random = new Random();
if (fc > 255)
fc = 255;
if (bc > 255)
bc = 255;
int r = fc + random.nextInt(bc - fc);
int g = fc + random.nextInt(bc - fc);
int b = fc + random.nextInt(bc - fc);
return new Color(r, g, b);
}
}
配置XML的设置,前台需要访问servlet的时候需要设置一个访问路径(迷惑用户url写成.jpg可以啦)
<servlet>
<servlet-name>RandomServlet</servlet-name>
<servlet-class>com.bjsxt.servlet.RandomServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>RandomServlet</servlet-name>
<url-pattern>/servlet/RandomServlet</url-pattern>
<url-pattern>/random.jpg</url-pattern>
</servlet-mapping>
在前端需要添加验证码的地方添加一个图片,图片的src可以设置为咱们之前设置的 random.jsp(这里的话我们需要提前在页面中写入基准路径才可以这样写),然后设置onclick的动作
<img src="random.jpg"name="changeRandom" id="changeRandom" alt="" onclick="change()">
script的函数这样写:
<script>
function change() {
var img=document.getElementById("changeRandom");
//后面写time的原因:
//每次生成验证码之后,就会在本地生成一个缓存,之后在点击的时候,首先会在浏览器的缓存中找
//相同的路径,只有添加了time,就是每次时间都不一样,就是后面的不一样,每次生成新的路径
//这样就可以生成新的验证码了
img.src="random.jpg?time="+new Date().toLocaleString();
}
</script>
这样就大公告成了!
那么我们要如何获得验证码和用户输入的是否正确呢?
用户输入的 : 我们后台就用 request.getParameter("输入那个文本框的name")来接受
验证码生成的那个 : 我们发现了验证码代码那一块,他就是将生成的用一个session来保存的
所以我们获取session的Attribute来接收就好啦。
String random=(String) request.getSession().getAttribute("randStr");
将两个判断一下就OK啦!