图片验证码

类似这样的效果

这个也是借鉴与网上大佬的,不多说直接上代码
后台:

package com.attendance.utils;

import javax.imageio.ImageIO;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.awt.*;
import java.awt.image.BufferedImage;
import java.util.Random;

public class RandomValidateCodeUtil {
    private static String RANDOMCODEKEY = "RANDOMVALIDATECODEUTIL";

    private String randString = "0123456789";//随机字符串

    private int width = 95; //图片宽

    private int height = 25; //图片高

    private int lineSize = 40; //干扰线数量

    private int stringNum = 4;//随机产生字符数量

    private Random random = new Random();

    /**
     * 获取字体
     */
    private Font getFont(){
        return new Font("Fixedsys",Font.CENTER_BASELINE,18);
    }

    /**
     * 获取颜色
     * @param fc
     * @param bc
     * @return
     */
    private Color getRandColor(int fc,int bc){
        if (fc > 255)
            fc = 255;
        if (bc > 255)
            bc = 255;
        int r = fc+random.nextInt(bc-fc-16);
        int g = fc+random.nextInt(bc-fc-14);
        int b = fc+random.nextInt(bc-fc-18);
        return new Color(r,g,b);
    }

    /**
     * 生成随机图片
     * @param request
     * @param response
     */
    public void getRandCode(HttpServletRequest request, HttpServletResponse response){
        HttpSession session = request.getSession();
        BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_BGR);
        Graphics graphics = image.getGraphics();
        graphics.fillRect(0,0,width,height);//图片大小
        graphics.setFont(new Font("Times new Roman",Font.ROMAN_BASELINE,18));
        graphics.setColor(getRandColor(110,133));

        //绘制干扰线
        for (int i = 0;i <= lineSize;i++){
            drowLine(graphics);
        }

        //绘制随机字符
        String randomString = "";
        for (int i = 1;i <= stringNum;i++){
            randomString = drowString(graphics,randomString,i);
        }
        System.out.println(randomString);
        //将生成的随机字符串保存到session中
        session.removeAttribute(RANDOMCODEKEY);
        session.setAttribute(RANDOMCODEKEY,randomString);
        graphics.dispose();
        try {
            ImageIO.write(image,"JPEG",response.getOutputStream());
        } catch (Exception e){
            e.printStackTrace();
        }
    }

    /**
     * 绘制字符串
     * @param graphics
     * @param randomString
     * @param i
     * @return
     */
    private String drowString(Graphics graphics,String randomString,int i){
        graphics.setFont(getFont());
        graphics.setColor(new Color(random.nextInt(101),random.nextInt(111),random.nextInt(121)));
        String rand = String.valueOf(getRandomString(random.nextInt(randString.length())));
        randomString += rand;
        graphics.translate(random.nextInt(3),random.nextInt(3));
        graphics.drawString(rand,13*i,16);
        return randomString;
    }

    /**
     * 绘制干扰线
     * @param graphics
     */
    private void drowLine(Graphics graphics){
        int x = random.nextInt(width);
        int y = random.nextInt(height);
        int x1 = random.nextInt(13);
        int y1 = random.nextInt(15);
        graphics.drawLine(x,y,x1,y1);
    }

    /**
     * 获取随机的字符
     * @param num
     * @return
     */
    public String getRandomString(int num){
        return String.valueOf(randString.charAt(num));
    }
}

前台:

<div class="layui-input-inline">
    <a href="javascript:void(0);" title="点击更换验证码">
        <img id="imgVerify" src="../user/getVerify" alt="更换验证码" class="layui-input" onclick="getCode(this)" >
    </a>
</div>

js:
最后后面接口后面跟一个随机数,具体为啥我也不知,反正不加,只能点一次,或者打开控制台进行点击换图片,反正加了不会错

function getCode(object) {
    $("#imgVerify").removeAttr("src");
    $("#imgVerify").attr("src","../user/getVerify?"+Math.random());
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值