像这样简单的验证码如何生成并显示在页面上并能点击不断刷新验证码呢?
1.首先创建一个servlet包并创建一个VerificationCodeServlet
package codewen.bookcool.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.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* 验证码servlet
* @author codewen
*
*/
@WebServlet("/VerificationCodeServlet")
public class VerificationCodeServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
int width = 100; //设置图片的宽度
int height = 35; //设置图片的高度
//在内存中生成一张图片
BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
//获取画笔
Graphics g = image.getGraphics();
g.setColor(Color.pink);
g.fillRect(0, 0, width, height); //画出粉色的填充框
g.setColor(Color.blue);
g.drawRect(0, 0, width-1, height-1); //画出蓝色的外边框
char a[] = {'0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B',
'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O',
'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 'a', 'b',
'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o',
'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'};
Random random = new Random();
g.setColor(Color.red);
Font font = new Font("萝莉体 第二版", Font.BOLD, 16);
g.setFont(font);
String Vcode = "";
//随机生成四个字母或数字
for(int i=1; i<=4; i++) {
//随机生成[0,a.length)的数
int index = random.nextInt(a.length);
Vcode+=a[index];
g.drawString(a[index]+"", width/5*i-5, height/2+5);
}
//将生成的验证码放入session(供登录时检验验证码使用)
request.getSession().setAttribute("Vcode", Vcode);
//显示图片
ImageIO.write(image, "jpg", response.getOutputStream());
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
2.jsp页面需要使用到验证码,直接调用即可
3.获取到验证码后,点击验证码能够不断刷新验证码也很重要
可以利用js获取图片对象并修改图片的src,给其src加时间戳
<!-- 这是一个图片链接,点击图片后执行refreshCode()函数更换图片 -->
<a href="javascript:refreshCode();"><img src="${pageContext.request.contextPath}/VerificationCodeServlet" title="看不清点击刷新" id="vcode_img"/></a>
<script type="text/javascript">
//刷新验证码的函数
function refreshCode() {
//获取图片对象
var vcode_img = document.getElementById("vcode_img");
vcode_img.onclick = function() {
//获取时间戳
var time = new Date().getTime();
vcode_img.src = "${pageContext.request.contextPath}/VerificationCodeServlet?time="+time;
}
}
</script>
需要注意的是在Linux下可能会出现图片加载不出来的情况,我查了很久在一篇博客找到了答案,大概的意思就是jwt包默认不被Linux识别,需要修改配置,详细可以参考Linux下验证码加载不出来
我还碰到过eclipse运行项目的时候,发现有时候验证码能加载,有时候加载不出来,可以试试清理项目和Tomcat服务器缓存