验证码登录（layui框架）

前提pom.xml   引用hutool包

<dependency>
    <groupId>cn.hutool</groupId>
    <artifactId>hutool-all</artifactId>
    <version>5.3.9<ersion>
  </dependency>

1.layui登录页面 

在账号密码下面添加验证码

<div class="layui-form-item">
                <label class="layui-form-label">验证码</label>
                <div class="layui-input-inline">
                    <div style="float: left;">
                        <input type="text" name="verifyCode" width="200px;" id="verifyCode" placeholder="请输入验证码"
                               autocomplete="off" class="layui-input verity">
                    </div>
                    <div style="float: left;">
                        <img id="verify" onclick="chageCode()" alt="点击刷新验证码" style="width: 90%;height: 39px;" />
                    </div>
                </div>
            </div>

引用jquery-3.3.1.js

<script src="/static/js/jquery-3.3.1.js"></script>

图片验证码生成
 function chageCode(){
        $('#verify').attr('src','/checkCode.do?random='+new Date());
    }
    chageCode();

Controller层

/**
     *
     图片验证码
     */
    @RequestMapping("/checkCode.do")
    @ResponseBody
    public void checkCod(HttpSession session, HttpServletResponse response ,Object random) throws IOException {
        System.out.println(random);
        CircleCaptcha circleCaptcha = CaptchaUtil.createCircleCaptcha(200, 100, 4, 5);
        String code = circleCaptcha.getCode();
        session.setAttribute("code", code);
        circleCaptcha.write(response.getOutputStream());

    }

替换你之前的login页面

//替换登录
@RequestMapping(value = "/logi")
    @ResponseBody
    public void login(@RequestParam Map<String,Object> map, HttpServletResponse response, HttpSession session){
        String verifyCode=map.get("verifyCode").toString();
        String code= session.getAttribute("code").toString();
        if (verifyCode.equals(code)){
            try {
                map=service.list(map).get(0);
                int aid =Integer.valueOf(map.get("aid").toString());
                session.setAttribute("aid",aid);
            } catch (IndexOutOfBoundsException e) {
                ReturnJson.json(ReturnMessage.error(),response);
            }
            ReturnJson.json(ReturnMessage.success(map),response);
        }
    }