1. 登录页面的jsp
login.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//D HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>登录页面</title>
<base href="<%=basePath %>">
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.4.1/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.4.1/themes/icon.css">
<link rel="stylesheet" type="text/css" href="css/common.css">
<script type="text/javascript" src="js/jquery3.4.1/jquery3.4.1.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.4.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.4.1/jquery.easyui.min.js"></script>
<script type="text/javascript" src="commons/validate.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.4.1/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="js/common.js"></script>
</head>
<body>
<div id="login_frame">
<img src="images/logo.png" class="logo">
<form method="post" action="/login/login" onsubmit="return check()">
<p><label class="label_input">用户名</label><input type="text" id="username" name="username" class="text_field"/>
</p>
<p><label class="label_input">密码</label><input type="password" id="password" name="password"
class="text_field"/></p>
<div id="login_control">
<input type="submit" id="btn_login" value="登录"/>
<%-- <a id="forget_pwd" href="forget_pwd.html">忘记密码？</a>--%>
</div>
</form>
</div>
</body>
</html>
<script>
function check() {
var username = $("#username").val();
var password = $("#password").val();
if (username === "" || username === null) {
alert("请输入用户名");
return false;
} else if (password === "" || password === null) {
alert("请输入密码");
return false;
} else {
return true;
}
}
</script>
<style>
body {
background-size: 100%;
background-repeat: no-repeat;
}
#login_frame {
width: 400px;
height: 260px;
padding: 13px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -200px;
margin-top: -200px;
background-color: #bed2c7;
border-radius: 10px;
text-align: center;
}
form p > * {
display: inline-block;
vertical-align: middle;
}
#image_logo {
margin-top: 22px;
}
.label_input {
font-size: 14px;
font-family: 宋体;
width: 65px;
height: 28px;
line-height: 28px;
text-align: center;
color: white;
background-color: #00303E;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.text_field {
width: 278px;
height: 28px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
border: 0;
}
#btn_login {
font-size: 14px;
font-family: 宋体;
width: 120px;
height: 28px;
line-height: 28px;
text-align: center;
color: white;
background-color: #00303E;
border-radius: 6px;
border: 0;
float: left;
}
#forget_pwd {
font-size: 12px;
color: white;
text-decoration: none;
position: relative;
float: right;
top: 5px;
}
#forget_pwd:hover {
color: blue;
text-decoration: underline;
}
#login_control {
padding: 0 28px;
}
.logo {
width: 40px;
height: 35px;
margin-top: -10px;
}
</style>
2. 登录的拦截器
public class LoginInterceptor implements HandlerInterceptor {
@Override
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object o) throws Exception {
// 获取请求的uri
String uri = request.getRequestURI();
// 除了login.jsp是可以公开访问的，其它的URL都没拦截
if (uri.indexOf("/login") >= 0) {
return true;
} else {
// 获取session
HttpSession session = request.getSession();
UserPojo user = (UserPojo) session.getAttribute("USER_SESSION");
// 判断session中是否有用户数据，如果有数据，则返回true。否则重定向到登录页面
if (user != null) {
return true;
} else {
response.sendRedirect("/login/login");
return false;
}
}
}
@Override
public void postHandle(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Object o,
ModelAndView modelAndView) throws Exception {
}
@Override
public void afterCompletion(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse,
Object o, Exception e) throws Exception {
}
}
3. 登录的 Controller
@RestController
@RequestMapping("/login")
public class LoginController {
//获取日志记录器Logger
private static Logger log = Logger.getLogger(LoginController.class);
/**
* 返回登录页面
*
* @return
*/
@RequestMapping("/login")
public ModelAndView login() {
ModelAndView mv = new ModelAndView("login/login");
log.info("返回登录页面");
return mv;
}
/**
* 登录方法
*
* @return
*/
@RequestMapping(value = "/login", method = RequestMethod.POST)
public ModelAndView doLogin(UserPojo user, HttpSession session) {
ModelAndView mv;
// 获取前台传过来的用户名和密码
String username = user.getUsername();
String password = user.getPassword();
// 根据用户名查询用户
UserPojo userPojo = userService.getUserByUsername(username);
// 从数据库中获取用户信息对用户名和密码进行判断
if (password != null && password.equals(userPojo.getPassword())) {
// 将用户对象添加到session中
session.setAttribute("USER_SESSION", userPojo);
// 重定向首页
mv = new ModelAndView("redirect:/index/index");
} else {
mv = new ModelAndView("/login/login");
mv.addObject("message", "用户名或密码错误,请重新登录！");
}
return mv;
}
/**
* 退出方法
*
* @return
*/
@RequestMapping(value = "/logout", method = RequestMethod.POST)
public ModelAndView logout(HttpSession session) {
// 退出前清除session 信息
session.invalidate();
ModelAndView mv = new ModelAndView("redirect:/login/login");
return mv;
}
}
