SpringSecurity+thymeleaf - 图片验证码生成

本文涉及的产品
云数据库 Tair(兼容Redis),内存型 2GB
Redis 开源版,标准版 2GB
推荐场景:
搭建游戏排行榜
简介: 验证主要步骤:1、访问登录页面,先对页面种植cookie。2、提供api生成图片验证码,使用开源kaptcha生成图片。3、生成图片时,获取cookie;以cookie值为key,图片验证码为value,缓存到redis。4、redis缓存1分钟。

配置pom.xml

<dependency>
    <groupId>com.github.penggle</groupId>
    <artifactId>kaptcha</artifactId>
    <version>2.3.2</version>
</dependency>

默认工具配置:KaptchaConfig

@Component
public class KaptchaConfig {
    @Bean
    public DefaultKaptcha getDefaultKaptcha() {
        DefaultKaptcha defaultKaptcha = new DefaultKaptcha();
        Properties properties = new Properties();
        // 图片边框
        properties.setProperty("kaptcha.border", "yes");
        // 边框颜色
        properties.setProperty("kaptcha.border.color", "105,179,90");
        // 字体颜色
        properties.setProperty("kaptcha.textproducer.font.color", "red");
        // 图片宽
        properties.setProperty("kaptcha.image.width", "100");
        // 图片高
        properties.setProperty("kaptcha.image.height", "34");
        // 字体大小
        properties.setProperty("kaptcha.textproducer.font.size", "30");
        // session key
        properties.setProperty("kaptcha.session.key", "code");
        // 验证码长度
        properties.setProperty("kaptcha.textproducer.char.length", "4");
        // 字体
        properties.setProperty("kaptcha.textproducer.font.names", "Consolas");
        // 设置字符串范围
        properties.setProperty("kaptcha.textproducer.char.string", "0123456789");
        Config config = new Config(properties);
        defaultKaptcha.setConfig(config);

        return defaultKaptcha;
    }
}

登录页面种植Cookie

// 获取种植的cookie
String cookieValue = IpUtils.getCookieValue(request, imgCookieName);
LOGGER.info("login cookieValue : {}", cookieValue);
if(cookieValue == null) {
    // 给前端种植一个cookie,用于图片验证码校验
    response.addCookie(new Cookie(imgCookieName, UUID.randomUUID().toString()));
}

生成图片API

/**
 * 验证码工具
 */
@Autowired
DefaultKaptcha defaultKaptcha;

/**
 * redis缓存数据
 */
@Autowired
private RedisTemplate<String, String> redisTemplate;

/**
 * 获取图片验证码
 * @throws IOException 
 */
@GetMapping("/verify")
public void verify(HttpServletRequest request, HttpServletResponse response) throws IOException {
    // 获取种植的cookie
    String cookieValue = IpUtils.getCookieValue(request, imgCookieName);
    LOGGER.info("verify cookieValue : {}", cookieValue);
    
    // 生产验证码字符串并保存到session中
    String createText = defaultKaptcha.createText();
    LOGGER.info("verify createText : {}", createText);
    
    // 缓存图片验证码到redis,设置超时时间1分钟
    redisTemplate.opsForValue().set(cookieValue, createText, 60, TimeUnit.SECONDS);
    
    // 使用生产的验证码字符串返回一个BufferedImage对象并转为byte写入到byte数组中
    ByteArrayOutputStream jpegOutputStream = new ByteArrayOutputStream();
    BufferedImage challenge = defaultKaptcha.createImage(createText);
    ImageIO.write(challenge, "jpg", jpegOutputStream);
    
    // 定义response输出类型为image/jpeg类型,使用response输出流输出图片的byte数组
    byte[] captchaChallengeAsJpeg = jpegOutputStream.toByteArray();
    response.setHeader("Cache-Control", "no-store, no-cache, must-revalidate");
    response.setHeader("Pragma", "no-cache");
    response.setDateHeader("Expires", 0);
    response.setContentType("image/jpeg");
    ServletOutputStream responseOutputStream = response.getOutputStream();
    responseOutputStream.write(captchaChallengeAsJpeg);
    responseOutputStream.flush();
    responseOutputStream.close();
    LOGGER.info("verify end ... ");
}
相关实践学习
基于Redis实现在线游戏积分排行榜
本场景将介绍如何基于Redis数据库实现在线游戏中的游戏玩家积分排行榜功能。
云数据库 Redis 版使用教程
云数据库Redis版是兼容Redis协议标准的、提供持久化的内存数据库服务,基于高可靠双机热备架构及可无缝扩展的集群架构,满足高读写性能场景及容量需弹性变配的业务需求。 产品详情:https://www.aliyun.com/product/kvstore &nbsp; &nbsp; ------------------------------------------------------------------------- 阿里云数据库体验:数据库上云实战 开发者云会免费提供一台带自建MySQL的源数据库&nbsp;ECS 实例和一台目标数据库&nbsp;RDS实例。跟着指引,您可以一步步实现将ECS自建数据库迁移到目标数据库RDS。 点击下方链接,领取免费ECS&amp;RDS资源,30分钟完成数据库上云实战!https://developer.aliyun.com/adc/scenario/51eefbd1894e42f6bb9acacadd3f9121?spm=a2c6h.13788135.J_3257954370.9.4ba85f24utseFl
相关文章
|
1月前
|
数据采集 自然语言处理 Python
用 Python 生成并识别图片验证码
用 Python 生成并识别图片验证码
31 1
|
3月前
|
SQL 前端开发 NoSQL
SpringBoot+Vue 实现图片验证码功能需求
这篇文章介绍了如何在SpringBoot+Vue项目中实现图片验证码功能,包括后端生成与校验验证码的方法以及前端展示验证码的实现步骤。
SpringBoot+Vue 实现图片验证码功能需求
|
4月前
【node】图片验证码(svg-captcha)
【node】图片验证码(svg-captcha)
248 0
|
5月前
|
前端开发 JavaScript 数据库
四. Django项目之电商购物商城 -- 图片验证码生成
四. Django项目之电商购物商城 -- 图片验证码生成
|
5月前
图片验证码制作(附源码)
图片验证码制作(附源码)
|
6月前
|
数据采集 安全 前端开发
Java如何制作图片输入验证码
Java如何制作图片输入验证码
54 0
|
6月前
|
Java 数据安全/隐私保护
Java 图片验证码需求分析
Java 图片验证码需求分析
77 0
|
Web App开发 Java
如何用java实现一个图片验证码
如何用java实现一个图片验证码
57 0
|
前端开发
react图形图片验证码重新请求图片不刷新
react图形图片验证码重新请求图片不刷新
118 0
|
PHP
PHP实现图片登录验证码的解决方案
PHP实现图片登录验证码的解决方案
122 0