javaWeb实现验证码--代码超简单

2019-11-13 16:06:58来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

javaWeb实现验证码--代码超简单

1、前端显示

HTML:

<h3>验证码:</h3>
<input type="text" name="validationCode" id="validationCode" placeholder="请输入验证码" lay-verify="required"> 
<img src="validate.jsp" id="validationCode_img" title="看不清?换一个" onclick="loadimage();return false;" name="validationCode_img" align="middle">

JS:

//加载验证码图片,后面加时间可以保证每次页面刷新时验证码也刷新
function loadimage(){
            document.getElementById("validationCode_img").src= "validate.jsp?time=" + new Date().getTime();
        }

2、用一个页面生成验证码图片,这里我用JSP页面validate.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@page import="java.awt.image.BufferedImage"%>
<%@page import="java.awt.Graphics2D"%>
<%@page import="java.awt.Color"%>
<%@page import="java.awt.Font"%>
<%@page import="javax.imageio.ImageIO"%>
<%@page import="java.util.Random"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>验证码</title>
</head>
<body>
<%
    int width = 60;
    int height = 20;
    // 创建具有可访问图像数据缓冲区的Image
    BufferedImage buffImg = new BufferedImage(width, height,BufferedImage.TYPE_INT_RGB);
    Graphics2D g = buffImg.createGraphics();
    
    // 创建一个随机数生成器
    Random random = new Random();
    
    g.setColor(Color.WHITE);
    g.fillRect(0, 0, width, height);
    
    // 创建字体,字体的大小应该根据图片的高度来定
    Font font = new Font("Times New Roman", Font.PLAIN, 18);
    // 设置字体
    g.setFont(font);
    
    // 画边框
    g.setColor(Color.BLACK);
    g.drawRect(0, 0, width - 1, height - 1);
    
    // 随机产生160条干扰线
    g.setColor(Color.LIGHT_GRAY);
    for (int i = 0; i < 160; i++) {
        int x = random.nextInt(width);
        int y = random.nextInt(height);
        int x1 = random.nextInt(12);
        int y1 = random.nextInt(12);
        g.drawLine(x, y, x + x1, y + y1);
    }
    
    // randomCode 用于保存随机产生的验证码
    StringBuffer randomCode = new StringBuffer();
    int red = 0, green = 0, blue = 0;
    
    // 随机产生4位数字的验证码
    for (int i = 0; i < 4; i++) {
        // 得到随机产生的验证码数字
        String strRand = String.valueOf(random.nextInt(10));
    
        // 产生随机的颜色分量来构造颜色值
        red = random.nextInt(110);
        green = random.nextInt(50);
        blue = random.nextInt(50);
    
        // 用随机产生的颜色将验证码绘制到图像中
        g.setColor(new Color(red, green, blue));
        g.drawString(strRand, 13 * i + 6, 16);
    
        randomCode.append(strRand);
    }
    
    // 将四位数字的验证码保存到session中
    //HttpSession session = request.getSession();
    session.setAttribute("randomCode", randomCode.toString());
    
    // 禁止图像缓存
    response.setHeader("Pragma", "no-cache");
    response.setHeader("Cache-Control", "no-cache");
    response.setDateHeader("Expires", 0);
    
    response.setContentType("image/jpeg");
    // 将图像输出到servlet输出流中
    ServletOutputStream sos = response.getOutputStream();
    ImageIO.write(buffImg, "jpeg", sos);
    sos.close();
    //sos = null;
    out.clear();
    out = pageContext.pushBody();
%>
</body>
</html>

3、在validate.jsp页面中生成的验证码其实就是在java后端生成的,所以就存进了session中,我们只需要在用户提交的时候将填写的验证码带到后端,这里我使用的是ajax请求,后端只需要判断验证码是否和session中一样就可以了。

 


原文链接:https://www.cnblogs.com/qiantao/p/11850956.html
如有疑问请与原作者联系

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:JDK1.8新特性——使用新的方式遍历集合

下一篇:2019.11软考软件设计师归来心得体会及复习备考指南