package com.hp.Controller; import cn.hutool.captcha.CaptchaUtil; import cn.hutool.captcha.CircleCaptcha; import cn.hutool.captcha.LineCaptcha; import javax.servlet.ServletException; import javax.servlet.ServletOutputStream; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; import java.io.IOException; @WebServlet(name = "CodeServlet",urlPatterns = "/CodeServlet") public class CodeServlet extends HttpServlet { @Override protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { //super.service(req, resp); //定义图形验证码的长、宽、验证码字符数、干扰元素个数 LineCaptcha captcha = CaptchaUtil.createLineCaptcha(200, 100); //拿到验证码 String code = captcha.getCode(); //3. 获取session中 HttpSession session = req.getSession(); //4.把验证码放到 session中 session.setAttribute("code",code); //5.把验证码 发送到 浏览器 ServletOutputStream outputStream = resp.getOutputStream(); captcha.write(outputStream); outputStream.close(); } }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登录</title> <script src="layui-v2.5.6/layui/layui.js"></script> <link rel="stylesheet" href="layui-v2.5.6/layui/css/layui.css"> </head> <body> <div> <form class="layui-form" action="" lay-filter="testform" οnsubmit="return false"> <div class="layui-form-item"> <label class="layui-form-label">用户名</label> <div class="layui-input-inline"> <input type="text" name="title" required lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">密码</label> <div class="layui-input-inline"> <input type="password" name="userpwd" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">验证码</label> <div class="layui-input-inline"> <input type="text" name="code" class="layui-input"> <img src="/CodeServlet" style="width:70px ;height:30px;"> </div> </div> <div class="layui-form-item"> <div class="layui-input-inline"> <button class="layui-btn" lay-submit lay-filter="formLogin">登录</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </div> </div> </form> </div> <script> layui.use(['form','jquery'],function () { var form = layui.form; var layer = layui.layer; }) </script> </body> </html>