1、前端实现
①添加一个表单标签：
<label for="remFlag">
<input name="remFlag" type="checkbox" id="remFlag" onclick="remember();">
记住密码
</label>
②js中需要添加：
<script type="text/javascript">
$(document).ready(function(){
//记住密码功能
var str = getCookie("loginInfo");
str = str.substring(1,str.length-1);
var username = str.split(",")[0];
var password = str.split(",")[1];
console.log(username + '666' + password);
//自动填充用户名和密码
$("#userName").val(username);
$("#userPwd").val(password);
});
//获取cookie
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1);
if (c.indexOf(name) != -1) return c.substring(name.length, c.length);
}
return "";
}
//记住密码功能
function remember(){
var remFlag = $("input[type='checkbox']").is(':checked');
if(remFlag==true){ //如果选中设置remFlag为1
//cookie存用户名和密码,回显的是真实的用户名和密码,存在安全问题.
var conFlag = confirm("记录密码功能不宜在公共场所(如网吧等)使用,以防密码泄露.您确定要使用此功能吗?");
if(conFlag){ //确认标志
$("#remFlag").val("1");
}else{
$("input[type='checkbox']").removeAttr('checked');
$("#remFlag").val("");
}
}else{ //如果没选中设置remFlag为""
$("#remFlag").val("");
}
}
</script>
2、java后端实现
/**
* 判断登录 post
*/
@RequestMapping(value = "/login", method = RequestMethod.POST)
public String login(@RequestParam(value = "userName", required = false) String userName,
@RequestParam(value = "userPwd", required = false) String userPwd,
HttpSession session,
HttpServletRequest req, HttpServletResponse resp) {
//412错误
//也可以直接清除响应的头部缓存，还可以直接在xml里配置跳转页面
resp.setHeader( "Cache-Control" , "no-store" ); //no-cache不行，还是会缓存
resp.setDateHeader( "Expires" , 0);
resp.setHeader( "Pragma" , "no-cache" );
System.out.println("用户IP地址" + req.getRemoteAddr());
NewsUser nu = new NewsUser();
nu.setUserName(userName);
nu.setPassword(userPwd);
NewsUser newsUser;
newsUser = nus.login(nu);
if (null != newsUser) {
System.out.println(null != newsUser);
session.setAttribute("newsUser", newsUser);
//记住用户名、密码功能(注意：cookie存放密码会存在安全隐患)
String remFlag = req.getParameter("remFlag");
if ("1".equals(remFlag)) { //"1"表示用户勾选记住密码
String loginInfo = userName + "," + userPwd;
Cookie userCookie = new Cookie("loginInfo", loginInfo);
userCookie.setMaxAge(30 * 24 * 60 * 60); //存活期为一个月 30*24*60*60
userCookie.setPath("/");
resp.addCookie(userCookie);
}
System.out.println(newsUser.getUserName());
return "admin/main";
} else {
session.setAttribute("msg", "用户名或密码错误");
return "redirect:/login.html";
}
}
3、这样的话基本就配置完成了
4、注意事项
使用时，需要保证用户名和密码都有 id属性