RuoYi若依系统的验证码如何替换为更美观的EasyCaptcha

　　先看效果：
　　使用Kaptcha的验证码
　　使用EasyCaptcha的验证码图片验证码的作用
　　图片验证码经常验证如下一些场景。（1）用户登录，防止机器人登录；（2）论坛留言，防止恶意灌水；（3）短信验证码发送，防止盗刷短信。Kaptcha简介
　　Kaptcha 是一个由谷歌Googel出品的可高度配置的实用验证码生成工具，是一个非常经典的图片验证码解决方案。但，这个开源的工具生成的图片比较素雅，美观度一般，且项目已经基本不维护了，从github上看，最近的一次更新是在3年前。
　　EasyCaptcha简介
　　EasyCaptcha是一个Java图形验证码库，支持gif、中文、算术等类型，可用于Java Web、JavaSE等项目。效果还是非常好看的，还有闪动效果。关键是该开源项目是国人开发，使用也超简单。
　　EasyCaptcha效果展示(部分验证码闪动，截图无法展示)划重点：若依系统RuoYi-Vue中替换为EasyCaptcha
　　（1）在ruoyi-frameworkpom.xml 添加依赖：   				com.github.whvcse 				easy-captcha 				1.6.2  
　　（2）在应用子系统中修改验证码生成的代码，比如ruoyi-admin的CaptchaController中修改getCode方法的代码：/**      * 生成验证码      */     @GetMapping(＂/captchaImage＂)     @ApiOperation(value = ＂生成验证码＂, notes = ＂生成验证码＂)     public AjaxResult getCode(HttpServletResponse response) throws IOException     {         AjaxResult ajax = AjaxResult.success();         boolean captchaOnOff = configService.selectCaptchaOnOff();         ajax.put(＂captchaOnOff＂, captchaOnOff);         if (!captchaOnOff)         {             return ajax;         }          // 保存验证码信息         String uuid = IdUtils.simpleUUID();         String verifyKey = Constants.CAPTCHA_CODE_KEY + uuid; /*  以下注释的部分是原代码 注释开始         String capStr = null, code = null;         BufferedImage image = null;          // 生成验证码         String captchaType = RuoYiConfig.getCaptchaType();         if (＂math＂.equals(captchaType))         {             String capText = captchaProducerMath.createText();             capStr = capText.substring(0, capText.lastIndexOf(＂@＂));             code = capText.substring(capText.lastIndexOf(＂@＂) + 1);             image = captchaProducerMath.createImage(capStr);         }         else if (＂char＂.equals(captchaType))         {             capStr = code = captchaProducer.createText();             image = captchaProducer.createImage(capStr);         }          redisCache.setCacheObject(verifyKey, code, Constants.CAPTCHA_EXPIRATION, TimeUnit.MINUTES);         // 转换流信息写出         FastByteArrayOutputStream os = new FastByteArrayOutputStream();         try         {             ImageIO.write(image, ＂jpg＂, os);         }         catch (IOException e)         {             return AjaxResult.error(e.getMessage());         }          ajax.put(＂uuid＂, uuid);         ajax.put(＂img＂, Base64.encode(os.toByteArray()));         return ajax; 注释结束*/       //以下6行是新加的代码         Captcha captcha = new ArithmeticCaptcha(115, 42);  //创建算术验证码         String code = captcha.text(); //得到算术验证码的计算值         redisCache.setCacheObject(verifyKey, code, Constants.CAPTCHA_EXPIRATION, TimeUnit.MINUTES);//存入redis          ajax.put(＂uuid＂, uuid);         ajax.put(＂img＂, captcha.toBase64());  //获得图片的base64编码         return ajax;     }
　　（3）在前端项目中，RuoYi-Vue3srcviewslogin.vue的getCode方法中修改如下：function getCode() {   getCodeImg().then(res => {     captchaOnOff.value = res.captchaOnOff === undefined ? true : res.captchaOnOff;     if (captchaOnOff.value) {       codeUrl.value = res.img;  //＂data:image/gif;base64,＂ + res.img;       loginForm.value.uuid = res.uuid;     }   }); }
　　说明：因为上一步中控制器返回的img中已经包含了＂data:image/gif;base64,＂这一串字符，故前端接收时就不要再加了。
　　（4）再分别重启前后端系统，就可以看到效果了。
　　【本文结束】
　　学习过程记录，有需要的朋友可以参考。欢迎一键三连（点赞、关注、评论）。