二、crm用户登录实现

用户在登录页面,输入用户名和密码,点击"登录"按钮或者回车,完成用户登录的功能.

         *用户名和密码不能为空

         *用户名或者密码错误,用户已过期,用户状态被锁定,ip受限 都不能登录成功

         *登录成功之后,所有业务页面显示当前用户的名称

         *实现10天记住密码

         *登录成功之后,跳转到业务主页面

         *登录失败,页面不跳转,提示信息

一、流程图

 二、包结构

三、代码实现

1.UserMapper 

①在UserMapper接口

    /**
     * 根据用户名和密码查询对象
     */
    User selectUserByLoginActAndPwd(Map map);

②在UserMapper映射文件

  
  
    select
    
    from tbl_user
    where login_act=#{loginAct} and login_pwd=#{loginPwd}
  

 注意:传过来参数的map的K一定是loginAct，loginPwd

2.UserService

 ①在UserService接口，写上方法

public interface UserService {
	User queryUserByLoginActAndPwd(Map map);
}

②在UserServiceImpl继承接口实现方法

@Service
public class UserServiceImpl implements UserService {
	@Autowired
	private UserMapper userMapper;
	@Override
	public User queryUserByLoginActAndPwd(Map map) {
		return userMapper.selectUserByLoginActAndPwd(map);
	}
}

@Service: 创建bean实例

@Autowired ：实现属性注入

③在Spring的配置文件 applicationContext.xml开启扫描注解

3.UserController 

①在SpringMVC配置文件扫描Controller层applicationContext-mvc.xml

②获取参数

//注入userService对象的实现类
@Autowired
private UserService userService;
@RequestMapping("settings/qx/user/login.do")
public @ResponseBody Object login(String loginAct, String loginPwd, String isRemPwd, HttpServletRequest request, HttpSession session, HttpServletResponse response) {

}

因为返回的是Json对象，所以返回类型是Object，通用性高。使用@ResponseBody，转换成Json

③封装参数

		//封装参数
		Map map = new HashMap<>();
		map.put("loginAct", loginAct);
		map.put("loginPwd", loginPwd);

map这里的K要和mapper查询语句对应起来。

④调用service的方法

		//调用service层方法查询用户
		User user = userService.queryUserByLoginActAndPwd(map);

⑤根据查询结果生成响应信息

 ⅠContants类保存常量,Json的code成功或失败

public class Contants {
	//保存ReturnObject的code值
	public static final String RETURN_OBJECT_CODE_SUCCESS = "1"; //成功
	public static final String RETURN_OBJECT_CODE_FAIL = "0"; //失败
	//保存当前用户的key
	public static final String SESSION_USER = "sessionUser"; //失败

}

Ⅱ ReturnObject是Json的格式

public class ReturnObject {
	private String code;//成功或者失败：1成功，0失败
	private String message;//提示信息
	private Object retDate;//返回其他数据

	public String getCode() {
		return code;
	}

	public void setCode(String code) {
		this.code = code;
	}

	public String getMessage() {
		return message;
	}

	public void setMessage(String message) {
		this.message = message;
	}

	public Object getRetDate() {
		return retDate;
	}

	public void setRetDate(Object retDate) {
		this.retDate = retDate;
	}
}

ⅢDateUtils统一日期格式的工具类

public class DateUtils {
	public static String formateDateTime(Date date){
		SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
		return sdf.format(date);
	}

	public static String formateDate(Date date){
		SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
		return sdf.format(date);
	}
}

//根据查询结果，生成响应信息
		ReturnObject returnObject = new ReturnObject();
		//根据查询结果响应信息
		if (user == null) {// 登录失败，用户名或密码错误
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
			returnObject.setMessage("用户名或密码错误");
		} else if (DateUtils.formateDateTime(new Date()).compareTo(user.getExpireTime()) > 0) { //时间失效了
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
			returnObject.setMessage("账号过期");
		} else if ("0".equals(user.getLockState())) { //0 锁定了 失败
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
			returnObject.setMessage("账号锁定");
		} else if (!user.getAllowIps().contains(request.getRemoteAddr())) { // ip地址不在范围
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
			returnObject.setMessage("ip受限");
		} else {//登录成功
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_SUCCESS);
 }
return returnObject;

完整的代码

@Controller
public class UserController {
	//注入userService对象的实现类
	@Autowired
	private UserService userService;

	/**
	 * 点击主页跳转到登录
	 */
	@RequestMapping("settings/qx/user/toLogin.do")
	public String toLogin() {
		return "settings/qx/user/login";
	}

	/**
	 * 用户登录功能
	 * 返回一个json
	 * 通用性高，返回Object
	 * ResponseBody--转换json
	 */
	@RequestMapping("settings/qx/user/login.do")
	public @ResponseBody
	Object login(String loginAct, String loginPwd, String isRemPwd, HttpServletRequest request, HttpSession session, HttpServletResponse response) {
		//封装参数
		Map map = new HashMap<>();
		map.put("loginAct", loginAct);
		map.put("loginPwd", loginPwd);
		//调用service层方法查询用户
		User user = userService.queryUserByLoginActAndPwd(map);
		//根据查询结果，生成响应信息
		ReturnObject returnObject = new ReturnObject();
		//根据查询结果响应信息
		if (user == null) {// 登录失败，用户名或密码错误
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
			returnObject.setMessage("用户名或密码错误");
		} else if (DateUtils.formateDateTime(new Date()).compareTo(user.getExpireTime()) > 0) { //时间失效了
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
			returnObject.setMessage("账号过期");
		} else if ("0".equals(user.getLockState())) { //0 锁定了 失败
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
			returnObject.setMessage("账号锁定");
		} else if (!user.getAllowIps().contains(request.getRemoteAddr())) { // ip地址不在范围
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
			returnObject.setMessage("ip受限");
		} else {//登录成功
			returnObject.setCode(Contants.RETURN_OBJECT_CODE_SUCCESS);
			// 把user存放到session
			session.setAttribute(Contants.SESSION_USER, user);

			//记住密码
			if ("true".equals(isRemPwd)) {
				Cookie c1 = new Cookie("loginAct", user.getLoginAct());//账号
				//设置生命周期
				c1.setMaxAge(10 * 24 * 60 * 60);
				//保存到浏览器
				response.addCookie(c1);
				Cookie c2 = new Cookie("loginPwd", user.getLoginPwd());//密码
				//设置生命周期
				c2.setMaxAge(10 * 24 * 60 * 60);
				//保存到浏览器
				response.addCookie(c2);
			}else {
				//删除之前cookie
				Cookie c1 = new Cookie("loginAct","1");//账号
				//设置生命周期
				c1.setMaxAge(0);
				//保存到浏览器
				response.addCookie(c1);
				Cookie c2 = new Cookie("loginPwd", "1");//密码
				//设置生命周期
				c2.setMaxAge(0);
				//保存到浏览器
				response.addCookie(c2);
			}
		}
		return returnObject;
	}

}

4.客户端

①用户输入账号和密码

 

            

                

                    
                
                

                    
                
                

                    
                        
                            
                        
                        
                            
                        
                        十天内免登录  
                    
                    

                    登录
                    
                
            
        

通过按钮id的值绑定单击事件

            //登录按钮添加单击事件
            $("#loginBtn").click(function () {
                // 收集参数,并且去除空格
                var loginAct = $.trim($("#loginAct").val());
                var loginPwd = $.trim($("#loginPwd").val());
                var isRemPwd = $('input[name="isRemPwd"]').prop("checked");
                alert(isRemPwd)
                // 表单验证
                if (loginAct == "") {
                    alert("用户名不为空");
                    return;//结束
                }
                if (loginPwd == "") {
                    alert("密码不为空");
                    return;//结束
                }
                // 发送请求
                $.ajax({
                    url: 'settings/qx/user/login.do',
                    data: {
                        loginAct: loginAct,
                        loginPwd: loginPwd,
                        isRemPwd: isRemPwd
                    },
                    type: 'post',
                    //解析返回的json------
                    dataType: 'json',
                    success: function (data) {
                        if (data.code == "1") {
                            //登录成功，跳转业务主页面Controller
                            window.location.href = "workbench/index.do";
                        } else {
                            // 提示信息
                            $("#msg").text(data.message);
                        }
                    },
                    beforeSend: function () { //ajax往后台发送执行这个函数
                        $("#msg").text("正在验证...");
                        return true;
                    }
                });

            });

跳转主页的controller

 

@Controller
public class WorkbenchIndexController {
	@RequestMapping("workbench/index.do")
	public String index(){
		return "workbench/index";
	}
}

②实现回车登录

        // 整个浏览器窗口添加键盘点击事件
            $(window).keydown(function (e) {
                // 回车键提交请求 13是回车
                if (e.keyCode == 13) {
                    $("#loginBtn").click();// 点击登录按钮
                }
            });

③实现记住密码，使用cookie

var isRemPwd = $('input[name="isRemPwd"]').prop("checked");

value="${cookie.loginPwd.value}"

                    
                        
                            
                        
                        
                            
                        
                        十天内免登录  
                    

完整的登录前端代码

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + request.getContextPath() + "/";
%>


    
    
    
    
    
    



    


    

        CRM  ©2022 动力节点



    

        

            
用户登录
        
        

            

                

                    
                
                

                    
                
                

                    
                        
                            
                        
                        
                            
                        
                        十天内免登录  
                    
                    

                    登录