1.新建一个meaven项目 webapp模板
2.修改目录，修改pom文件
3.添加jdbc.properties属性文件
4. 添加SqlMapperconfig。xml文件
5.添加applicationContext_mapper.xml文件
6.添加applicationContext_service.xml文件
7.添加springmvc.xml文件
8..删除web.xml文件 新建改名 设置中文编码 注册springmbc框架 注册spring框架
9.添加静态资源网页（一般为了数据的安全，都会把页面放到WEB-INF下,因为WEB-INF目录下的资源是受保护的，外界不能直接访问。）
访问WEB-INF/pages/index.jsp
10.把crm项目部署到tomcat上 （资源自动跳转到项目http://localhost:8080/crm下的index.html页面
访问web-inf下的文件出现404 编写controller类 页面转发进行内部访问
在springmvc.xml文件中配置视图解析器 添加前缀后缀
<!-- 配置视图解析器 -->
<bean id="viewResolver"
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="/WEB-INF/pages/"/>
<property name="suffix" value=".jsp"/>
</bean>
新建com/bjpowernode/crm/settings/web/controller 项目包
package com.bjpowernode.crm.web.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class IndexController {
/*给controller 方法分配url
* http://localhost:8080/DemoCrm1/
* */
@RequestMapping("/")
public String index(){
return "index"; //WEB-INF/pages/index.jsp
}
}启动tomcat页面转发到到 http://localhost:8080/crm/WEB-INF/pages/index.jsp
访问到首页 
二. 在当前首页面跳转到登录页面 （转发）
<script type="text/javascript"> window.location.href = "settings/qx/user/toLogin.do"; </script>
新建 com/bjpowernode/crm/setting/web/controller包
创建UserController
三.登录页面 实现登录验证
前端静态页面编写
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>
<html>
<head>
<base href="<%=basePath%>">
<meta charset="UTF-8">
<link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
<script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(function () {
//给整个浏览器窗口添加键盘按下事件
$(window).keydown(function (e) {
//如果按的是回车键，则提交登录请求
if(e.keyCode==13){
$("#loginBtn").click();
}
});
//给"登录"按钮添加单击事件
$("#loginBtn").click(function () {
//收集参数
var loginAct=$.trim($("#loginAct").val());
var loginPwd=$.trim($("#loginPwd").val());
var isRemPwd=$("#isRemPwd").prop("checked");
//表单验证
if(loginAct==""){
alert("用户名不能为空");
return;
}
if(loginPwd==""){
alert("密码不能为空");
return;
}
//显示正在验证
//$("#msg").text("正在努力验证....");
//发送请求
$.ajax({
url:'settings/qx/user/login.do',
data:{
loginAct:loginAct,
loginPwd:loginPwd,
isRemPwd:isRemPwd
},
type:'post',
dataType:'json',
success:function (data) {
if(data.code=="1"){
//跳转到业务主页面
window.location.href="workbench/index.do";
}else{
//提示信息
$("#msg").text(data.message);
}
},
beforeSend:function () {//当ajax向后台发送请求之前，会自动执行本函数；
//该函数的返回值能够决定ajax是否真正向后台发送请求：
//如果该函数返回true,则ajax会真正向后台发送请求；否则，如果该函数返回false，则ajax放弃向后台发送请求。
$("#msg").text("正在努力验证....");
return true;
}
});
});
});
</script>
</head>
<body>
<div style="position: absolute; top: 0px; left: 0px; width: 60%;">
<img src="image/IMG_7114.JPG" style="width: 100%; height: 90%; position: relative; top: 50px;">
</div>
<div id="top" style="height: 50px; background-color: #3C3C3C; width: 100%;">
<div style="position: absolute; top: 5px; left: 0px; font-size: 30px; font-weight: 400; color: white; font-family: 'times new roman'">CRM <span style="font-size: 12px;">©2019 动力节点</span></div>
</div>
<div style="position: absolute; top: 120px; right: 100px;width:450px;height:400px;border:1px solid #D5D5D5">
<div style="position: absolute; top: 0px; right: 60px;">
<div class="page-header">
<h1>登录</h1>
</div>
<form action="workbench/index.html" class="form-horizontal" role="form">
<div class="form-group form-group-lg">
<div style="width: 350px;">
<input class="form-control" id="loginAct" type="text" value="${cookie.loginAct.value}" placeholder="用户名">
</div>
<div style="width: 350px; position: relative;top: 20px;">
<input class="form-control" id="loginPwd" type="password" value="${cookie.loginPwd.value}" placeholder="密码">
</div>
<div class="checkbox" style="position: relative;top: 30px; left: 10px;">
<label>
<c:if test="${not empty cookie.loginAct and not empty cookie.loginPwd}">
<input type="checkbox" id="isRemPwd" checked>
</c:if>
<c:if test="${empty cookie.loginAct or empty cookie.loginPwd}">
<input type="checkbox" id="isRemPwd">
</c:if>
十天内免登录
</label>
<span id="msg" style="color: red"></span>
</div>
<button type="button" id="loginBtn" class="btn btn-primary btn-lg btn-block" style="width: 350px; position: relative;top: 45px;">登录</button>
</div>
</form>
</div>
</div>
</body>
</html>Ajax 请求提交到 url:'settings/qx/user/login.do', 前端携带参数
编写controller
接受前端数据 封装成map 调用service 查询user信息 (mybatis逆向工程生成对应的domain mapper接口和mapper文件 在编写service接口和service文件 )
service层 User queryUserByLoginAndPwd(Map<String,Object> map);
mapper层 User queryUserByLoginAndPwd(Map<String,Object> map);
mapper接口实现类
<select id="queryUserByLoginAndPwd" resultMap="BaseResultMap" parameterType="map">
select <include refid="Base_Column_List"></include>
from tbl_user
where login_act=#{loginAct} and login_pwd=#{loginPwd}
</select>
根据查询结果 判断user 把结果封装实体类
private String code; private String message; private Object retDate;
进行登录验证判断
登录失败： 用户名或者密码错误,用户已过期,用户状态被锁定,ip受限 都不能登录成功
设置code为 0 message=“******”
登录成功 ： 设置code为 1 保存user信息 到session中
如果设置了免密登录 if ("true".equals(isRemPwd))
设置cookie中保存 用户 和登录密码
Cookie cookie1=new Cookie("loginAct",loginAct);
cookie1.setMaxAge(10*24*60*60);
response.addCookie(cookie1);
没有设置免密登录：
//把没有过期的cookie删除
Cookie cookie1=new Cookie("loginAct","1");
cookie1.setMaxAge(0);
response.addCookie(cookie1);
返回封装的信息
return returnObject;
@RequestMapping("/settings/qx/user/login.do")
@ResponseBody
public Object login(String loginAct, String loginPwd,
String isRemPwd, HttpServletRequest request,
HttpSession session, HttpServletResponse response){
//封装前端传过来的参数 用户登录信息
Map<String,Object> map=new HashMap<>();
map.put("loginAct",loginAct);
map.put("loginPwd",loginPwd);
//把封装的map作为参数 来执行service层 调用mapper 查询数据库
User user=userService.queryUserByLoginAndPwd(map);
//根据查询结果生成响应信息
ReturnObject returnObject=new ReturnObject();
if(user==null){
//登录失败 用户名或密码错误
returnObject.setCode("0");
returnObject.setMessage("用户名或密码错误");
}else{
/**用户名或者密码错误,用户已过期,用户状态被锁定,ip受限 都不能登录成功*/
SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
String nowTime = sdf.format(new Date());
if(user.getExpireTime().compareTo(nowTime)<0){
//登录账号过期
returnObject.setCode("0");
returnObject.setMessage("用户账号已过期");
}else if("0".equals(user.getLockState())){
returnObject.setCode("0");
returnObject.setMessage("用户账号被锁定");
}else if (!user.getAllowIps().contains(request.getRemoteAddr())){
returnObject.setCode("0");
returnObject.setMessage("用户ip受限");
}else{
//登录成功
returnObject.setCode("1");
//保存session中
session.setAttribute("user",user);
//如果需要记住密码 则往外写cookie
if ("true".equals(isRemPwd)){
Cookie cookie1=new Cookie("loginAct",loginAct);
cookie1.setMaxAge(10*24*60*60);
response.addCookie(cookie1);
Cookie cookie2=new Cookie("loginPwd",loginPwd);
cookie2.setMaxAge(10*24*60*60);
response.addCookie(cookie2);
}else{
//把没有过期的cookie删除
Cookie cookie1=new Cookie("loginAct","1");
cookie1.setMaxAge(0);
response.addCookie(cookie1);
Cookie cookie2=new Cookie("loginPwd","1");
cookie2.setMaxAge(0);
response.addCookie(cookie2);
}
}
}
return returnObject;
}登录页面点击提交 携带参数 ajax请求
$("#loginBtn").click(function () {
//收集参数
var loginAct=$.trim($("#loginAct").val());
var loginPwd=$.trim($("#loginPwd").val());
var isRemPwd=$("#isRemPwd").prop("checked");
//表单验证
if(loginAct==""){
alert("用户名不能为空");
return;
}
if(loginPwd==""){
alert("密码不能为空");
return;
}
//显示正在验证
//$("#msg").text("正在努力验证....");
//发送请求
$.ajax({
url:'settings/qx/user/login.do',
data:{
loginAct:loginAct,
loginPwd:loginPwd,
isRemPwd:isRemPwd
},
type:'post',
dataType:'json',
success:function (data) {
if(data.code=="1"){
//跳转到业务主页面
window.location.href="workbench/index.do";
}else{
//提示信息
$("#msg").text(data.message);
}
},
beforeSend:function () {//当ajax向后台发送请求之前，会自动执行本函数；
//该函数的返回值能够决定ajax是否真正向后台发送请求：
//如果该函数返回true,则ajax会真正向后台发送请求；否则，如果该函数返回false，则ajax放弃向后台发送请求。
$("#msg").text("正在努力验证....");
return true;
}
});
});
});调用success函数 登录成功 code=1 时 页面跳转到 workbench/index.do
实现登陆验证 和 免密登录
1765
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
