-
知识点4--CMS项目首页登录注册
在知识点2开发首页的时候，有在头部黑框右侧留了两个按钮，并有与之绑定的JS事件如下
<div class="col-md-2 bg-dark pt-2"> <c:if test="${sessionScope.user==null }"> <button class="btn btn-link btn-sm text-decoration-none " data-toggle="modal" data-target="#exampleModal" onclick="reg()"> <font color="white">注册font> button> <button class="btn btn-link btn-sm text-decoration-none" data-toggle="modal" data-target="#exampleModal" onclick="login()"> <font color="white">登录font> button> c:if> div>- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
//注册 function reg() { $("#title").text("用户注册"); $("#modalbody").load("/passport/reg.do"); } function login() { $("#title").text("用户登录"); $("#modalbody").load("/passport/login.do"); }- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
本篇知识点我们就来完善它的开发，首先在代码中可以知道，我们需要两个很简单的页面，在不同的情况下加载到模态框中，下面我们来写这两个页面，首先是注册用的
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>用户注册title> <link href="/resource/css/bootstrap.min.css" rel="stylesheet"> <script type="text/javascript" src="/resource/js/jquery-3.2.1.js">script> <script type="text/javascript" src="/resource/js/jquery.validate.js">script> <script type="text/javascript" src="/resource/js/bootstrap.min.js">script> head> <body> <div class="container"> <span id="msg" class="text-danger">span> <form id="form1"> <div class="form-group"> <label for="username">用户名label> <input type="text" class="form-control" name="username" id="username"> div> <div class="form-group"> <label for="password">密码label> <input type="password" class="form-control" name="password" id="password"> div> <div class="form-group"> <label for="repassword">确认密码label> <input type="password" class="form-control" name="rePassword" id="repassword"> div> 性别 <div class="form-group form-check form-check-inline"> <input type="radio" class="form-check-input" name="gender" value="1" id="boy" checked="checked"> <label class="form-check-label" for="boy">男label> div> <div class="form-group form-check form-check-inline"> <input type="radio" class="form-check-input" name="gender" value="0" id="goril"> <label class="form-check-label" for="goril">女label> div> <div> <button type="submit" class="btn btn-primary">注册button> <button type="reset" class="btn btn-dark">重置button> div> form> div> <script type="text/javascript"> $("#form1").validate( { //1.定义校验规则 rules : { username : { required : true,//用户名非空 rangelength : [ 2, 6 ],//用户名长度在2-6之间 remote:{ type:"post", data:{username:function(){ return $("[name='username']").val(); }}, url:"/passport/checkpass.do" } }, password : { required : true,//密码非空 rangelength : [ 6, 12 ]//密码长度在6-10之间 }, repassword : { equalTo : "#password" } }, //2:如果不满足规则，进行提示 messages : { username : { required : "用户名不能为空", rangelength : "用户名长度在2-6之间", remote:"用户已存在" }, password : { required : "密码非空", rangelength : "密码长度在6-10之间" }, rePassword : { equalTo : "两次密码输入不一致" } }, submitHandler : function() { $.post("/passport/reg.do", $("#form1").serialize(), function(result) { if (result.code == 200) {//如果注册成功跳转到登录页面 //$("#msg").text(result.msg); $("#modalbody").load("/passport/login.do"); } else {//注册失败 $("#msg").text(result.msg); } }); } } ); script> body> html>- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
随后是登录用的
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>用户登录title> <link href="/resource/css/bootstrap.min.css" rel="stylesheet"> <script type="text/javascript" src="/resource/js/jquery-3.2.1.js">script> <script type="text/javascript" src="/resource/js/jquery.validate.js">script> <script type="text/javascript" src="/resource/js/bootstrap.min.js">script> head> <body> <div class="container"> <span id="msg" class="text-danger">span> <form id="form1"> <div class="form-group"> <label for="username">用户名label> <input type="text" class="form-control" name="username" id="username"> div> <div class="form-group"> <label for="password">密码label> <input type="password" class="form-control" name="password" id="password"> div> <div class="form-group"> <button type="submit" class="btn btn-info" >登录button> <button type="reset" class="btn btn-primary">重置button> div> form> div> body> <script type="text/javascript"> $(function(){ $("#form1").validate({ //1.定义校验规则 rules:{ username:{ required:true//用户名非空 }, password:{ required:true//密码非空 } }, //2:如果不满足规则，进行提示 messages:{ username:{ required:"用户名不能为空" }, password:{ required:"密码非空" } }, submitHandler:function(){ $.post("/passport/login.do",$("#form1").serialize(),function(result){ if(result.code==200){//如果登录成功 location.href="/index.do" }else{//登录失败 $("#msg").text(result.msg) } }); } }) }) script> html>- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
此时前端页面就写好了，由于代码中访问页面都需要请求后台，所以我们要开发一个注册、登录用的Controller，且涉及到用户，所以我们需要开发用户Bean的Dao和Service层
首先是用户Dao层
package com.wy.dao; import java.util.List; import com.wy.bean.User; /** * * @ClassName: UserMapper * @Description: 用户信息 * @author: charles * @date: 2020年4月7日 上午9:38:31 */ public interface UserMapper { /** * * @Title: selects * @Description: 用户列表 * @param user * @return * @return: List*/ List<User> selects(User user); /** * * @Title: update * @Description: 修改用户 * @param user * @return * @return: int */ int update(User user); /** * * @Title: insert * @Description:注册用户 * @param user * @return * @return: int */ int insert(User user); /** * * @Title: selectByName * @Description: 根据用户名查询用户 * @param name * @return * @return: User */ User selectByName(String name); }- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
以及对应的Xml
DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" > <mapper namespace="com.wy.dao.UserMapper"> <select id="selects" resultType="com.wy.bean.User"> select * from cms_user <where> <if test="username!=null and username!=''"> username like "%"#{username}"%" if> <if test="locked!=null"> and locked=#{locked} if> where> select> <update id="update"> update cms_user <trim prefix="set" suffix="where id =#{id}"> <if test="locked!=null"> locked =#{locked} if> trim> update> <insert id="insert"> insert into cms_user (username,password,gender) values(#{username},#{password},#{gender}) insert> <select id="selectByName" resultType="com.wy.bean.User"> select * from cms_user where username =#{usename} select> mapper>- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
之后是Service层
package com.wy.service; import com.github.pagehelper.PageInfo; import com.wy.bean.User; public interface UserService { /** * * @Title: selects * @Description: TODO * @param user * @param page * @param pageSize * @return * @return: Pageinfo*/ PageInfo<User> selects(User user, Integer page, Integer pageSize); /** * * @Title: update * @Description: 管理员修改用户修改用户 * @param user * @return * @return: int */ int update(User user); /** * * @Title: insert * @Description:注册用户 * @param user * @return * @return: int */ boolean insert(User user); /** * * @Title: selectByName * @Description: 根据用户名查询用户 * @param name * @return * @return: User */ User selectByName(String name); /** * * @Title: login * @Description: TODO * @param user * @return * @return: User */ User login(User user); }- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
以及对应的实现类
package com.wy.service; import java.util.List; import javax.annotation.Resource; import org.springframework.stereotype.Service; import com.wy.dao.UserMapper; import com.wy.utils.CMSException; import com.wy.utils.Md5Util; import com.github.pagehelper.PageHelper; import com.github.pagehelper.PageInfo; import com.wy.bean.User; import com.wy.common.util.StringUtil; @Service public class UserServiceImpl implements UserService { @Resource private UserMapper userMapper; @Override public PageInfo<User> selects(User user ,Integer page, Integer pageSize) { PageHelper.startPage(page, pageSize); List<User> list = userMapper.selects(user); return new PageInfo<User>(list); } @Override public int update(User user) { // TODO Auto-generated method stub return userMapper.update(user); } @Override public boolean insert(User user) { //使用工具类处理注册业务逻辑 //1用户名不能为空 if(!StringUtil.hasText(user.getUsername())) throw new CMSException("用户名不能为空"); //2用户名的长度 if(!(user.getUsername().length()>=2 && user.getUsername().length()<=6) ) throw new CMSException("用户名的长度应该在2-6之间"); //3.密码 if(!StringUtil.hasText(user.getPassword())) throw new CMSException("密码不能为空"); //4密码长度 if(!(user.getPassword().length()>=6 && user.getPassword().length()<=10) ) throw new CMSException("密码长度6-10之间"); //5确认密码是否为空 if(!StringUtil.hasText(user.getRePassword())) throw new CMSException("确认密码不能为空"); //6两次密码是否一致 if(!user.getRePassword().equals(user.getPassword())) throw new CMSException("两次密码是不一致"); //加密用户密码 user.setPassword(Md5Util.encode(user.getPassword())); return userMapper.insert(user)>0; } @Override public User selectByName(String name) { return userMapper.selectByName(name); } @Override public User login(User user) { //1用户名不能为空 if(!StringUtil.hasText(user.getUsername())) throw new CMSException("用户名不能为空"); //2.密码 if(!StringUtil.hasText(user.getPassword())) throw new CMSException("密码不能为空"); //3.先根据用户查询是否有该用户 User u = this.selectByName(user.getUsername()); if(null ==u) throw new CMSException("用户名不正确"); //4.比较密码 if(!u.getPassword().equals(Md5Util.encode(user.getPassword()))) throw new CMSException("密码不正确"); //5不可让禁用用户登录 if(u.getLocked()==1) throw new CMSException("账户被禁用"); return u; } }- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
用户Bean的Service写完后，会有三个类找不到
import com.wy.utils.CMSException; import com.wy.utils.Md5Util; import com.wy.common.util.StringUtil;- 1
- 2
- 3
CMSException 是自定义的异常类，用来统一抛出CMS项目中的业务异常
package com.wy.utils; /** * * @ClassName: CMSException * @Description: cms的自定义异常 * @author: charles * @date: 2020年4月9日 上午10:59:06 */ public class CMSException extends RuntimeException { /** * @fieldName: serialVersionUID * @fieldType: long * @Description: TODO */ private static final long serialVersionUID = 1L; public String message;//消息 public CMSException() { } public CMSException(String message) { super(message); this.message = message; } public String getMessage() { return message; } public void setMessage(String message) { this.message = message; } }- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
Md5Util 是用户注册时对密码的加盐加密
package com.wy.utils; import org.apache.commons.codec.digest.DigestUtils; /** * * @ClassName: Md5Util * @Description: 对密码进行加密处理 * @author: charles * @date: 2020年3月12日 上午9:51:41 */ public class Md5Util { /** * 直接对密码进行散列，那么黑客可以对通过获得这个密码散列值， * 然后通过查散列值字典（例如MD5密码破解网站），得到某用户的密码。 * 加Salt可以一定程度上解决这个问题 */ private static String salt ="qazwsx1234"; public static String encode(String password) { return DigestUtils.md5Hex(password + salt); } }- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
StringUtil 是我自己日常的工具类，我没有在项目的pom中导入，是让大家可以选择你可以自己写一个，或者是从我们github上拉取下来我的工具类，然后自己使用，我的工具类连接
https://github.com/wangyang159/CommonUtil
依赖补充完成后我们就可以开发注册登录的Controller了
package com.wy.controller; import javax.annotation.PostConstruct; import javax.annotation.Resource; import javax.servlet.http.HttpSession; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.ResponseBody; import com.wy.bean.User; import com.wy.service.UserService; import com.wy.utils.CMSException; import com.wy.utils.CMSResult; @RequestMapping("passport") @Controller public class PassportController { @Resource private UserService userService; /** * * @Title: reg * @Description: 去注册 * @return * @return: String */ @GetMapping("reg.do") public String reg() { return "passport/reg"; } /** * * @Title: reg * @Description: 执行注册 * @param user * @return * @return: boolean */ @ResponseBody @PostMapping("reg.do") public CMSResult<User> reg(Model model,User user) { CMSResult<User> result =new CMSResult<User>(); try { userService.insert(user); result.setCode(200);//状态码 result.setMsg("恭喜注册成功,请登录");//错误消息 } catch (CMSException e) {//捕获自定义异常 e.printStackTrace(); result.setCode(300);//状态码 result.setMsg(e.message);//错误消息 }catch (Exception e) { e.printStackTrace(); result.setCode(400);//状态码 result.setMsg("未知错误，请联系管理员");//错误消息 } return result; } /** * * @Title: login * @Description: 普通用户去登录 * @return * @return: String */ @GetMapping("login.do") public String login() { return "passport/login"; } /** * * @Title: login * @Description: 普通用户执行登录 * @param user * @return * @return: CMSResult*/ @ResponseBody @PostMapping("login.do") public CMSResult<User> login(User user,HttpSession session){ CMSResult<User> result =new CMSResult<User>(); try { User u = userService.login(user); result.setCode(200); result.setMsg("登录成功"); //登录成功 存session session.setAttribute("user", u); } catch (CMSException e) {//捕获自定义异常 e.printStackTrace(); result.setCode(300);//状态码 result.setMsg(e.message);//错误消息 }catch (Exception e) { e.printStackTrace(); result.setCode(400);//状态码 result.setMsg("未知错误，请联系管理员");//错误消息 } return result; } /** * * @Title: logout * @Description: 注销 * @param session * @return * @return: String */ @RequestMapping("logout.do") public String logout(HttpSession session) { session.invalidate(); return "redirect:/index.do"; } @RequestMapping("checkpass.do") @ResponseBody public boolean checkpass(String username){ User user = userService.selectByName(username); return user==null; } /** * * @Title: loginAdmin * @Description: 跳转到管理员的登录页面 * @return * @return: String */ @RequestMapping("admin/toLogin.do") public String loginAdmin() { return "passport/login_admin"; } /** * * @Title: login * @Description: 管理用户执行登录 * @param user * @return * @return: CMSResult*/ @ResponseBody @PostMapping("admin/login.do") public CMSResult<User> loginAdmin(User user,HttpSession session){ CMSResult<User> result =new CMSResult<User>(); try { User u = userService.login(user); result.setCode(200); result.setMsg("登录成功"); //如果是普通用户 if(u.getRole().equals("0")) {//role：1:管理员 0：普通用户 throw new CMSException("没有登录权限"); } session.setAttribute("admin", u); } catch (CMSException e) {//捕获自定义异常 e.printStackTrace(); result.setCode(300);//状态码 result.setMsg(e.message);//错误消息 }catch (Exception e) { e.printStackTrace(); result.setCode(400);//状态码 result.setMsg("未知错误，请联系管理员");//错误消息 } return result; } }- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 112
- 113
- 114
- 115
- 116
- 117
- 118
- 119
- 120
- 121
- 122
- 123
- 124
- 125
- 126
- 127
- 128
- 129
- 130
- 131
- 132
- 133
- 134
- 135
- 136
- 137
- 138
- 139
- 140
- 141
- 142
- 143
- 144
- 145
- 146
- 147
- 148
- 149
- 150
- 151
- 152
- 153
- 154
- 155
- 156
- 157
- 158
- 159
- 160
- 161
- 162
- 163
- 164
- 165
- 166
- 167
- 168
- 169
- 170
- 171
- 172
- 173
- 174
- 175
- 176
- 177
- 178
- 179
- 180
- 181
- 182
- 183
当上面的Controller写完，你会短一个CMSResult，这个是
统一返回模板作用是统一后端给前端返回非页面路径时值的格式package com.wy.utils; /** * * @ClassName: Result * @Description: 返回统一的结果值 * @author: charles * @date: 2020年1月11日 下午3:09:12 * @param*/ public class CMSResult<T> { //返回结果的状态 private Integer code; private String msg; private T data; public Integer getCode() { return code; } public void setCode(Integer code) { this.code = code; } public String getMsg() { return msg; } public void setMsg(String msg) { this.msg = msg; } public T getData() { return data; } public void setData(T data) { this.data = data; } }- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
这里修复一个bug，在首页页面的登录、注册事件中标题动态修改代码选择器的ID值用错了，改过来
function reg() { $("#exampleModalLabel").text("用户注册"); $("#modalbody").load("/passport/reg.do"); } function login() { $("#exampleModalLabel").text("用户登录"); $("#modalbody").load("/passport/login.do"); }- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
修复完成上面的Bug，你就可以运行项目，查看效果了
上面是普通用户的登录，正常情况下，还会有一个管理员页面，这个页面的访问路径只有开发者知道，我们需要准备一个管理员登录页面，在本Demo中不允许管理员直接注册，所以也没有开发，大家可以自己扩展
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>管理员登录title> <link href="/resource/css/bootstrap.min.css" rel="stylesheet"> <link href="/resource/css/jquery/screen.css" rel="stylesheet"> <script type="text/javascript" src="/resource/js/jquery-3.2.1.js">script> <script type="text/javascript" src="/resource/js/jquery.validate.js">script> <script type="text/javascript" src="/resource/js/bootstrap.min.js">script> head> <body> <div class="container col-md-5"> <h1>管理员登录h1> <hr> <span id="msg" class="text-danger">${msg } span> <form id="form1"> <div class="form-group"> <label for="username">用户名label> <input type="text" class="form-control" name="username" id="username"> div> <div class="form-group"> <label for="password">密码label> <input type="password" class="form-control" name="password" id="password"> div> <div class="form-group"> <button type="submit" class="btn btn-info" >登录button> <button type="reset" class="btn btn-primary">重置button> div> form> div> body> <script type="text/javascript"> $(function(){ $("#form1").validate({ //1.定义校验规则 rules:{ username:{ required:true//用户名非空 }, password:{ required:true//密码非空 } }, //2:如果不满足规则，进行提示 messages:{ username:{ required:"用户名不能为空" }, password:{ required:"密码非空" } }, submitHandler:function(){ $.post("/passport/admin/login.do",$("#form1").serialize(),function(result){ if(result.code==200){//如果登录成功 location.href="/admin/index.do";//进入管理员后台页面 }else{//登录失败 $("#msg").text(result.msg) } }); } }) }) script> html>- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
本章中，我们先只做到管理登录成功，至于成功后跳转的管理页面，我们后面再去开发，现在运行代码查看是否登录成功
如果你用的是知识点1的环境，则在此页面使用admin/123456登录，由于还没有开发后续功能，所以报一个404是正常的
到此登录注册功能开发完成本项目目前以上传github ：https://github.com/wangyang159/cmsdemo
-
相关阅读:
校园学习《乡村振兴战略下传统村落文化旅游设计》许少辉八一新著
我的git笔记
基于可解释性特征矩阵与稀疏采样全局特征组合的人体行为识别
java-net-php-python-s2s酒店管理系统计算机毕业设计程序
详细Ubuntu16~20TLS安装NVIDIA驱动教程
使用C#根据Windows API判断窗体是否置顶
IDEA的使用
手把手教你从 0 到 1 搭建一套 RocketMQ 集群
centos7磁盘扩容（虚拟机Mac m1）
2022-11-16 Acwing每日一题
- 原文地址：https://blog.csdn.net/dudadudadd/article/details/126882966
