自己实现图形验证码

如果不想重复造轮子，参考上一篇文章：SpringBoot生成图形验证码_Muscleheng的博客-CSDN博客

这里不需要依赖开源组件包，完全自己实现图形验证码功能

两步完成：

第一步：编写图形验证码工具

package com.zhh.demo.common.util;

import lombok.extern.slf4j.Slf4j;
import org.apache.tomcat.util.codec.binary.Base64;
import org.springframework.stereotype.Component;

import javax.imageio.ImageIO;
import javax.servlet.http.HttpServletResponse;
import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.ByteArrayOutputStream;
import java.io.IOException;
import java.util.Random;

/**
 * @Description: 图形验证码
 * @Author: zhaoheng
 * @CreateTime: 2022-12-09
 */
@Slf4j
@Component
public class GraphValidateCode {

    //设置图片宽
    private int width = 70;

    //设置图片高度
    private int height = 30;

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

    /** 随机产生数字和字母组合的字符串,字体只显示大写，去掉了1,0,i,o几个容易混淆的字符 */
    public static final String VERIFY_CODES = "23456789ABCDEFGHJKLMNPQRSTUVWXYZ";

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

    /**
     * 获得颜色
     */
    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 - 16);
        int g = fc + random.nextInt(bc - fc - 14);
        int b = fc + random.nextInt(bc - fc - 18);
        return new Color(r, g, b);
    }

    /**
     * 获取验证码
     *
     * @return
     */
    public String getIdentifyCode() {
        Random random = new Random();
        StringBuffer buffer = new StringBuffer();
        for (int i = 0; i < 4; i++) {
            char c = VERIFY_CODES.charAt(random.nextInt(VERIFY_CODES.length()));
            buffer.append(c);
        }
        return buffer.toString();
    }

    /**
     * 生成随机图片
     *
     * @param identifyCode  图形码值
     * @return
     */
    public BufferedImage getIdentifyImage(String identifyCode) {
        //BufferedImage类是具有缓冲区的Image类，Image类是用来描述图像信息的类
        BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_BGR);
        //产生Image对象的Graphics对象，改对象可以在图像上进行各种绘制操作
        Graphics graphics = image.getGraphics();
        //图片大小
        graphics.fillRect(0, 0, width, height);
        //字体大小
        graphics.setFont(new Font("Times New Roman", Font.ROMAN_BASELINE, 20));
        //字体颜色
        graphics.setColor(getRandColor(110, 133));
        //绘制干扰线
        for (int i = 0; i <= lineSize; i++) {
            drawLine(graphics);
        }
        //绘制随机字符
        drawString(graphics, identifyCode);
        graphics.dispose();
        return image;

    }

    /**
     * 绘制字符串
     * @param g     产生Image对象的Graphics对象
     * @param identifyCode  图形码值
     */
    private void drawString(Graphics g, String identifyCode) {
        Random random = new Random();
        for (int i = 0; i < identifyCode.length(); i++) {
            g.setFont(getFont());
            g.setColor(new Color(random.nextInt(101), random.nextInt(111), random
                    .nextInt(121)));
            g.translate(random.nextInt(3), random.nextInt(3));
            // x:图形码值基于图片最左边的距离
            g.drawString(String.valueOf(identifyCode.charAt(i)), 13 * i + 8, 18);
        }
    }

    /**
     * 绘制干扰线
     */
    private void drawLine(Graphics graphics) {
        Random random = new Random();
        int x = random.nextInt(width);
        int y = random.nextInt(height);
        int xl = random.nextInt(13);
        int yl = random.nextInt(15);
        graphics.drawLine(x, y, x + xl, y + yl);
    }

    /**
     * 响应验证码图片
     *
     * @param identifyImg   图形码对象
     * @param response
     */
    public void responseIdentifyImg(BufferedImage identifyImg, HttpServletResponse response) {
        //设置响应类型，告诉浏览器输出的内容是图片
        response.setContentType("image/jpeg");
        //设置响应头信息，告诉浏览器不用缓冲此内容
        response.setHeader("Pragma", "No-cache");
        response.setHeader("Cache-Control", "no-cache");
        response.setDateHeader("Expire", 0);
        try {
            //把内存中的图片通过流动形式输出到客户端
            ImageIO.write(identifyImg, "JPEG", response.getOutputStream());
        } catch (IOException e) {
            log.error("图形验证码输出错误", e);
        }
    }

    /**
     * BufferedImage转base64
     * @param img  BufferedImage 对象
     * @return
     */
    public String getBase64FromImage(BufferedImage img) {
        String base64 = "";
        try (ByteArrayOutputStream stream = new ByteArrayOutputStream()) {
            // 设置图片的格式
            ImageIO.write(img, "jpg", stream);
            byte[] bytes = Base64.encodeBase64(stream.toByteArray());
            base64 = new String(bytes);
        } catch (IOException e) {
            log.error("图形验证码转base64错误", e);
        }
        return "data:image/jpeg;base64," + base64;
    }

}

第二步：编写接口

两个接口，两种方式：1.接口直接返回图片。2.接口返回base64字符串。

@Api(tags = "验证码-api")
@RequestMapping("/api/test")
@RestController
public class TestController {

    // 模拟把验证码的值存储到缓存(记得添加过期时间)
    Map<String,String> hashMap = new HashMap<>();

    @Autowired
    private GraphValidateCode graphValidateCode;

    /**
     * 给前端返回一个验证码图片
     * @return
     */
    @ApiOperation("获取图形验证码")
    @GetMapping("/identifyImage")
    public void identifyImage(HttpServletResponse response,
                              @ApiParam(value = "图形验证码id,无值：生成验证码，有值:刷新验证码")
                              @RequestParam(name = "codeId", required = false) String codeId) {
        // 验证码
        String identifyCode = graphValidateCode.getIdentifyCode();
        // 模拟把验证码的值存储到缓存(记得添加过期时间)
        if (codeId == null) {
            System.out.println("获取图形码");
            codeId = ToolUtil.simpleUUID();
            // 保存图形码值
            hashMap.put(codeId, identifyCode);
        } else {
            System.out.println("刷新图形码");
            // 更新图形码值，此时此刻 图形码可能已经过期删除，那就相对于保存一个新的
            hashMap.put(codeId, identifyCode);
        }

        // 图形验证码对应的UUID放在header中，前端可以拿到
        response.setHeader("codeId", codeId);
        //根据验证码创建图片
        BufferedImage identifyImage = graphValidateCode.getIdentifyImage(identifyCode);
        //回传给前端
        graphValidateCode.responseIdentifyImg(identifyImage, response);
    }

    /**
     * 给前端返回一个验证码图片-base64格式
     * @return
     */
    @ApiOperation("获取图形验证码-base64格式")
    @GetMapping("/identifyImage2")
    public String identifyImage2(
            @ApiParam(value = "图形验证码id,无值：生成验证码，有值:刷新验证码")
            @RequestParam(name = "codeId", required = false) String codeId) {
        String identifyCode = graphValidateCode.getIdentifyCode();

        // 模拟把验证码的值存储到缓存(记得添加过期时间)
        if (codeId == null) {
            System.out.println("获取图形码");
            codeId = ToolUtil.simpleUUID();
            // 保存图形码值
            hashMap.put(codeId, identifyCode);
        } else {
            System.out.println("刷新图形码");
            // 更新图形码值，此时此刻 图形码可能已经过期删除，那就相对于保存一个新的
            hashMap.put(codeId, identifyCode);
        }

        //根据验证码创建图片
        BufferedImage identifyImage = graphValidateCode.getIdentifyImage(identifyCode);
        //回传给前端
        System.out.println("新图形码值:" + identifyCode);
        return graphValidateCode.getBase64FromImage(identifyImage);
    }

}

效果展示：