1 图片验证码意义
验证码可以防止恶意破解密码、刷票、论坛灌水,有效防止某个黑客对某一个特定注册用户用特定程序暴力破解方式进行不断的登录尝试。由于验证码技术具有随机性随机性较强、简单的特点,能够在一定程度上阻碍网络上恶意行为的访问,在互联网领域得到了广泛的应用。
页面效果如下所示:
2 实现思路
整体的实现思路,如下图所示:
3在表现层新增一个接口
java">package com.atguigu.spzx.manager.controller;import com.atguigu.spzx.manager.service.SysUserService;
import com.atguigu.spzx.manager.service.ValidateCodeService;
import com.atguigu.spzx.model.dto.system.LoginDto;
import com.atguigu.spzx.model.vo.common.Result;
import com.atguigu.spzx.model.vo.common.ResultCodeEnum;
import com.atguigu.spzx.model.vo.system.LoginVo;
import com.atguigu.spzx.model.vo.system.ValidateCodeVo;
import io.swagger.v3.oas.annotations.Operation;
import io.swagger.v3.oas.annotations.tags.Tag;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;@Tag(name = "用户接口")
@RestController
@RequestMapping(value = "admin/system/index")
public class IndexController {@Autowiredprivate SysUserService sysUserService;@Autowiredprivate ValidateCodeService validateCodeService;//用户登录@Operation(summary = "登录")@PostMapping(value = "Login")public Result login(@RequestBody LoginDto loginDto){LoginVo loginVo = sysUserService.login(loginDto);return Result.build(loginVo, ResultCodeEnum.SUCCESS);}//登录图形验证码@Operation(summary = "生成图形验证码")@PostMapping(value = "/generateValidateCode")public Result<ValidateCodeVo> generateValidateCode(){ValidateCodeVo validateCodeVo = validateCodeService.generateValidateCode();return Result.build(validateCodeVo, ResultCodeEnum.SUCCESS);}
}
4 定义图片验证码生成服务接口
java">package com.atguigu.spzx.manager.service;import com.atguigu.spzx.model.vo.system.ValidateCodeVo;public interface ValidateCodeService {//图片验证码生成方法ValidateCodeVo generateValidateCode();
}
5 定义图片验证码生成服务实现类
java">package com.atguigu.spzx.manager.service.impl;import cn.hutool.captcha.CaptchaUtil;
import cn.hutool.captcha.LineCaptcha;
import cn.hutool.core.img.ImgUtil;
import com.atguigu.spzx.manager.service.ValidateCodeService;
import com.atguigu.spzx.model.vo.system.ValidateCodeVo;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.redis.core.RedisTemplate;
import org.springframework.stereotype.Service;import java.awt.*;
import java.util.UUID;
import java.util.concurrent.TimeUnit;@Service
public class ValidateCodeServiceImpl implements ValidateCodeService {@AutowiredRedisTemplate<String,String> redisTemplate;@Overridepublic ValidateCodeVo generateValidateCode(){//1.通过工具生成图片验证码,hutoolLineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(150,45,4,2);//长、宽、位数、干扰线数量//2.把验证码存储到redis中,设置redis的key:uuid,value:验证码,过期时间String validateCode = lineCaptcha.getCode();//获取验证码值//获取验证码图片//修改验证码突破原色(先改变背景色,然后重新生成图片,将图片转为base64)lineCaptcha.setBackground(Color.decode("#f8f8f8"));Image lineCaptchaImage = lineCaptcha.createImage(validateCode);//String validateCodeB64 = lineCaptcha.getImageBase64();String validateCodeB64 = ImgUtil.toBase64(lineCaptchaImage,"png");String key ="validateCode/"+ UUID.randomUUID().toString().replaceAll("-","");redisTemplate.opsForValue().set(key,validateCode,1, TimeUnit.MINUTES);//3.返回ValidateCodeVo对象ValidateCodeVo validateCodeVo = new ValidateCodeVo();validateCodeVo.setCodeKey(key);validateCodeVo.setCodeValue("data:image/png;base64,"+validateCodeB64);return validateCodeVo;}
}
6启动项目
打开http://localhost:3000/doc.html
点击调试可以看到接口功能正常
查看前端效果: