今天学习JavaWeb简单实现了验证码，记录一下。。
验证码展示出来为一张图片，其中包括验证码本身（数字）以及干扰线条，使用画笔绘制。话不多说，直接展示代码：
绘制验证码的img.jsp
<%@ page import="java.awt.*" %>
<%@ page import="java.util.Random" %>
<%@ page import="java.awt.image.BufferedImage" %>
<%@ page import="javax.imageio.ImageIO" %>
<%@ page contentType="image/jpeg;charset=UTF-8" language="java" %>
<%!
//随机产生颜色值
public Color getColor() {
Random random = new Random();
int r = random.nextInt(256);
int g = random.nextInt(256);
int b = random.nextInt(256);
return new Color(r, g, b);
}
//产生验证码值
public String getNum() {
int ran = (int)(Math.random() * 9000) + 1000;
return String.valueOf(ran);
}
%>
<%
//禁止缓存，防止验证码过期
response.setHeader("Pragma", "no-cache");
response.setHeader("Cache-control", "no-cache");
response.setHeader("Expires", "0");
//绘制验证码
BufferedImage image = new BufferedImage(80, 30, BufferedImage.TYPE_INT_RGB);
//画笔
Graphics graphics = image.getGraphics();
graphics.fillRect(0, 0, 80, 30);
//绘制干扰线条
for (int i = 0; i < 60; i++) {
Random random = new Random();
int xBegin = random.nextInt(80);
int yBegin = random.nextInt(30);
int xEnd = random.nextInt(xBegin + 10);
int yEnd = random.nextInt(yBegin + 10);
graphics.setColor(getColor());
//绘制线条
graphics.drawLine(xBegin, yBegin, xEnd, yEnd);
}
graphics.setFont(new Font("seif", Font.BOLD, 20));
//绘制验证码
graphics.setColor(Color.BLACK);
String checkCode = getNum();
StringBuilder stringBuffer = new StringBuilder();
for (int i = 0; i < checkCode.length(); i++) {
stringBuffer.append(checkCode.charAt(i)).append(" ");
}
graphics.drawString(stringBuffer.toString(), 15, 20);
//将验证码真实值 保存在session中，供使用时比较真实性
session.setAttribute("checkCode", checkCode);
//真实地产生图片
ImageIO.write(image, "jpeg", response.getOutputStream());
//关闭
out.clear();
out = pageContext.pushBody();
%>
使用验证码index.jsp：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>验证码</title>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script>
function reloadCheckImg() {
//这里加上后面的是为了保证每次请求都是不一样的
$("#checkCodeImg").attr("src", "img.jsp?t="+(new Date().getTime()));
}
//文档就绪函数
$(document).ready(function () {
$("#checkCodeId").blur(function () {
//获取用户输入的验证码值
var $checkCode = $("#checkCodeId").val();
//向服务端发送post请求
$.post("CheckCodeServlet", {
"checkCode":$checkCode}, function (result) {
var rsHTMl = $("<img src='" + result + "' height='15px' width='15px' />")
$("#tip").html(rsHTMl)
});
});
});
</script>
</head>
<body>
<!-- 验证码 -->
<a href="javascript:reloadCheckImg();"> <img id="checkCodeImg" src="img.jsp" alt="验证码"/> </a> <br/>
验证码：<input type="text" name="checkCode" id="checkCodeId" size="4">
<span id="tip"></span>
</body>
</html>
最后是处理用户输入验证码的Servlet：
package pers.kuroko.servlet;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
@WebServlet(value = "/CheckCodeServlet")
public class CheckCodeServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//设置默认返回信息
String resultTip = "imgs/wrong.jpg";
//获取用户输入
String checkCodeClient = request.getParameter("checkCode");
//从session中获取验证码真实值
String checkCodeServer = (String) request.getSession().getAttribute("checkCode");
if (checkCodeClient.equals(checkCodeServer)) {
resultTip = "imgs/right.jpg";
}
response.setContentType("text/html;charset=UTF-8");
PrintWriter writer = response.getWriter();
writer.write(resultTip);
writer.flush();
writer.close();
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request, response);
}
}
运行结果：
当验证码输入错误时，在旁边显示一个叉
当验证码输入正确时，在旁边显示对勾
