效果：
验证码还是没有布局好.背景比较怀古.
1.写前端html
login.jsp
<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="viewport" ???content="width=device-width, initial-scale=1, maximum-scale=1"><title>登录</title><link rel="stylesheet" href="/static/css/layui.css"><link rel="stylesheet" href="/static/css/login.css"></head><body> ???<div class="clear box layui-main login"> ???????<form class="layui-form layui-form-pane1" action="ulogin" method="post"> ???????????<div class="layui-form-item"> ???????????????<label class="layui-form-label">用户名：</label> ???????????????<div class="layui-input-block"> ???????????????????<input type="text" name="user.name" lay-verify="uname" required ???????????????????????placeholder="请输入用户名" autocomplete="off" class="layui-input">${UnameErrMsg?if_exists} ???????????????</div> ???????????</div> ???????????<div class="layui-form-item"> ???????????????<label class="layui-form-label">密码：</label> ???????????????<div class="layui-input-block"> ???????????????????<input type="password" name="user.pwd" lay-verify="" required ???????????????????????placeholder="请输入密码" autocomplete="off" class="layui-input">${PwdErrMsg?if_exists} ???????????????</div> ???????????</div> ???????????<div class="layui-form-item"> ???????????????<label class="layui-form-label">验证码：</label> ???????????????<div class="layui-input-block"> ???????????????????<input type="text" name="yzm" lay-verify="" required ???????????????????????placeholder="请输入验证码" autocomplete="off" class="layui-input">${yzmErrMsg?if_exists}<br> ???????????????<a href="/login.html"><img alt="验证码" src="/yzm"></a> ???????????????</div> ???????????</div> ???????????<div class="layui-form-item"> ???????????<label class="layui-form-label"></label> ???????????????<button class="layui-btn layui-btn-normal btn-center" type="submit">登录</button> ???????????</div> ???????</form> ???</div> ???<script src="/static/js/layui.js"></script></body></html>登录界面样式
@CHARSET "UTF-8";body{ ???background-image:url(/static/images/login-bg.png);}.login { ???padding-top: 15%; ???width: 26%;}.btn-center{ ???text-center:center; ???margin:0 auto;}2.写控制器
其中就是login方法与ulogin方法
controller包下IndexController类
package cn.pangpython.controller;import com.jfinal.aop.Before;import com.jfinal.core.Controller;import com.jfinal.ext.kit.SessionIdKit;import cn.pangpython.model.User;import cn.pangpython.utils.DateUtils;import cn.pangpython.utils.MD5;import cn.pangpython.validate.RegistValidator;import cn.pangpython.validate.UserLoginValidator;/** * @author pangPython * 主页控制器 */public class IndexController extends Controller { ???public void index(){ ???????renderText("index"); ???} ???//渲染注册页面 ???public void regpage(){ ???????render("regist.html"); ???} ???//处理注册 ???@Before(RegistValidator.class) ???public void regist(){ ???????String pwd = getPara("user.pwd"); ???????String confirm = getPara("reg.confirm"); ???????//验证码验证 ???????boolean result = validateCaptcha("reg.yzm"); ???????if(!result){ ???????????setAttr("yzmErrMsg", "验证码错误！"); ???????????render("regist.html"); ???????????return; ???????} ???????//确认密码验证 ???????if(!pwd.equals(confirm)){ ???????????setAttr("confirmErrMsg", "请正确填写确认密码！"); ???????????render("regist.html"); ???????????return; ???????} ???????String uname = getPara("user.name"); ???????User user = getModel(User.class); ???????String reg_time = DateUtils.dateToUnixTimestamp(DateUtils.getNowTime())+""; ???????//使用用户注册日期作为md5密码加密的盐值,可节省一个salt数据库字段 ???????pwd = MD5.GetMD5Code(pwd+reg_time); ???????//给user实体类填充数据 ???????user.setName(uname); ???????user.setPwd(pwd); ???????user.setRegTime(reg_time); ???????//使用jfinal的保存操作 ???????user.save(); ???????renderText("注册成功！"); ???} ???public void login(){ ???????render("login.html"); ???} ???@Before(UserLoginValidator.class) ???public void ulogin(){ ???????// 验证码结果 ???????boolean result = validateCaptcha("yzm"); ???????if (!result) { ???????????setAttr("yzmErrMsg", "验证码错误！"); ???????????render("login.html"); ???????????return; ???????} ???????String uname = getPara("user.name"); ???????String sql = "select * from user where name = ? limit 1"; ???????User user = User.dao.findFirst(sql, uname); ???????if (user != null) { ???????????String pwd = MD5.GetMD5Code(getPara("user.pwd") + user.getRegTime()); ???????????if (user.getPwd().equals(pwd)) { ???????????????// 生成唯一标识 ???????????????String sessionId = SessionIdKit.me().generate(getRequest()); ???????????????// 设置服务器端session ???????????????setSessionAttr(sessionId, user); ???????????????// 设置用户端cookie ???????????????setCookie("cuser", sessionId, 60000); ???????????????//redirect("/user"); ???????????????renderText("登录成功！"); ???????????} else { ???????????????// 密码不正确 ???????????????setAttr("UnameErrMsg", "用户名或密码不正确！"); ???????????????render("login.html"); ???????????} ???????} else { ???????????// 用户名不存在 ???????????setAttr("UnameErrMsg", "用户名不存在！"); ???????????render("login.html"); ???????} ???}}3.写登录验证器
validator包下的UserLoginValidator继承JFinal的Validator
package cn.pangpython.validate;import com.jfinal.core.Controller;import com.jfinal.validate.Validator;public class UserLoginValidator extends Validator { ???@Override ???protected void handleError(Controller controller) { ???????controller.keepPara(); ???} ???@Override ???protected void validate(Controller arg0) { ???????validateRequired("user.name", "UnameErrMsg", "请输入用户名！"); ???????validateRequired("user.pwd", "PwdErrMsg", "请输入密码！"); ???????validateRequired("yzm", "yzmErrMsg", "请输入验证码！"); ???}}注：验证码的校验也可以在验证器中进行验证
到此就完成了登录功能.运行config文件，访问
http://localhost/login
原文：https://blog.csdn.net/u012995856/article/details/52927053
JFinal Web开发学习(七)使用layUI美化的登录功能
原文地址：https://www.cnblogs.com/wyhluckdog/p/10294322.html