Spring Boot项目登陆页面记住密码功能——Cookie

红太狼 2022-11-07 11:32 363阅读 0赞

  Cookie,一种储存在用户本地终端上的数据,有时也用其复数形式 Cookies。类型为“小型文本文件”,是某些网站为了辨别用户身份,进行 Session 跟踪而储存在用户本地终端上的数据(通常经过加密),由用户客户端计算机暂时或永久保存的信息。

  其实 Cookie 就是一个键和一个值构成的,随着服务器端的响应发送给客户端浏览器。然后客户端浏览器会把 Cookie 保存起来,当下一次再访问服务器时把 Cookie 再发送给服务器。

  • 1、Cookie 是 HTTP 协议的规范之一,它是服务器和客户端之间传输的小数据
  • 2、首先由服务器通过响应头把 Cookie 传输给客户端,客户端会将 Cookie 保存起来
  • 3、当客户端再次请求同一服务器时,客户端会在请求头中添加该服务器保存的 Cookie,发送给服务器
  • 4、Cookie 就是服务器保存在客户端的数据
  • 5、Cookie 就是一个键值对

在这里插入图片描述

二、使用步骤

  1. // Cookie 为键值对数据格式
  2. Cookie cookie_username = new Cookie("cookie_username", username);
  1. // 即:过期时间,单位是:秒(s)
  2. cookie_username.setMaxAge(30 * 24 * 60 * 60);
  1. // 表示当前项目下都携带这个cookie
  2. cookie_username.setPath(request.getContextPath());
  1. // 使用 HttpServletResponse 对象向客户端发送 Cookie
  2. response.addCookie(cookie_username);
  1. // 根据 key 将 value 置空
  2. Cookie cookie_username = new Cookie("cookie_username", "");
  3. // 设置持久时间为0
  4. cookie_username.setMaxAge(0);
  5. // 设置共享路径
  6. cookie_username.setPath(request.getContextPath());
  7. // 向客户端发送 Cookie
  8. response.addCookie(cookie_username);

三、案例分析

  上面我们已经了解了 Cookie 是什么,并且知道了 Cookie 的创建以及销毁的方法,下面,我们就使用 Cookie 实现记住登录状态的功能,整个项目基于 SpringBoot 实现

  温馨提示:注重Cookie部分代码即可,其他实体类等那些根据你自己的去弄。

bean层:

  1. package com.example.business.bean;
  2. import java.io.Serializable;
  3. /** * tp_user * @author */
  4. public class TpUserBean implements Serializable {
  5. private Integer id;
  6. private String appId;
  7. private String userid;
  8. private String username;
  9. private String password;
  10. /** * 组ID */
  11. private Short role;
  12. /** * 状态 1:启用 0:禁止 */
  13. private Boolean status;
  14. /** * 备注说明 */
  15. private String remark;
  16. /** * 最后登录时间 */
  17. private Long lastLoginTime;
  18. /** * 最后登录IP */
  19. private String lastLoginIp;
  20. /** * 最后登录位置 */
  21. private String lastLocation;
  22. private String sessionid;
  23. private static final long serialVersionUID = 1L;
  24. public Integer getId() {
  25. return id;
  26. }
  27. public void setId(Integer id) {
  28. this.id = id;
  29. }
  30. public String getAppId() {
  31. return appId;
  32. }
  33. public void setAppId(String appId) {
  34. this.appId = appId;
  35. }
  36. public String getUserid() {
  37. return userid;
  38. }
  39. public void setUserid(String userid) {
  40. this.userid = userid;
  41. }
  42. public String getUsername() {
  43. return username;
  44. }
  45. public void setUsername(String username) {
  46. this.username = username;
  47. }
  48. public String getPassword() {
  49. return password;
  50. }
  51. public void setPassword(String password) {
  52. this.password = password;
  53. }
  54. public Short getRole() {
  55. return role;
  56. }
  57. public void setRole(Short role) {
  58. this.role = role;
  59. }
  60. public Boolean getStatus() {
  61. return status;
  62. }
  63. public void setStatus(Boolean status) {
  64. this.status = status;
  65. }
  66. public String getRemark() {
  67. return remark;
  68. }
  69. public void setRemark(String remark) {
  70. this.remark = remark;
  71. }
  72. public Long getLastLoginTime() {
  73. return lastLoginTime;
  74. }
  75. public void setLastLoginTime(Long lastLoginTime) {
  76. this.lastLoginTime = lastLoginTime;
  77. }
  78. public String getLastLoginIp() {
  79. return lastLoginIp;
  80. }
  81. public void setLastLoginIp(String lastLoginIp) {
  82. this.lastLoginIp = lastLoginIp;
  83. }
  84. public String getLastLocation() {
  85. return lastLocation;
  86. }
  87. public void setLastLocation(String lastLocation) {
  88. this.lastLocation = lastLocation;
  89. }
  90. public String getSessionid() {
  91. return sessionid;
  92. }
  93. public void setSessionid(String sessionid) {
  94. this.sessionid = sessionid;
  95. }
  96. @Override
  97. public boolean equals(Object that) {
  98. if (this == that) {
  99. return true;
  100. }
  101. if (that == null) {
  102. return false;
  103. }
  104. if (getClass() != that.getClass()) {
  105. return false;
  106. }
  107. TpUserBean other = (TpUserBean) that;
  108. return (this.getId() == null ? other.getId() == null : this.getId().equals(other.getId()))
  109. && (this.getAppId() == null ? other.getAppId() == null : this.getAppId().equals(other.getAppId()))
  110. && (this.getUserid() == null ? other.getUserid() == null : this.getUserid().equals(other.getUserid()))
  111. && (this.getUsername() == null ? other.getUsername() == null : this.getUsername().equals(other.getUsername()))
  112. && (this.getPassword() == null ? other.getPassword() == null : this.getPassword().equals(other.getPassword()))
  113. && (this.getRole() == null ? other.getRole() == null : this.getRole().equals(other.getRole()))
  114. && (this.getStatus() == null ? other.getStatus() == null : this.getStatus().equals(other.getStatus()))
  115. && (this.getRemark() == null ? other.getRemark() == null : this.getRemark().equals(other.getRemark()))
  116. && (this.getLastLoginTime() == null ? other.getLastLoginTime() == null : this.getLastLoginTime().equals(other.getLastLoginTime()))
  117. && (this.getLastLoginIp() == null ? other.getLastLoginIp() == null : this.getLastLoginIp().equals(other.getLastLoginIp()))
  118. && (this.getLastLocation() == null ? other.getLastLocation() == null : this.getLastLocation().equals(other.getLastLocation()))
  119. && (this.getSessionid() == null ? other.getSessionid() == null : this.getSessionid().equals(other.getSessionid()));
  120. }
  121. @Override
  122. public int hashCode() {
  123. final int prime = 31;
  124. int result = 1;
  125. result = prime * result + ((getId() == null) ? 0 : getId().hashCode());
  126. result = prime * result + ((getAppId() == null) ? 0 : getAppId().hashCode());
  127. result = prime * result + ((getUserid() == null) ? 0 : getUserid().hashCode());
  128. result = prime * result + ((getUsername() == null) ? 0 : getUsername().hashCode());
  129. result = prime * result + ((getPassword() == null) ? 0 : getPassword().hashCode());
  130. result = prime * result + ((getRole() == null) ? 0 : getRole().hashCode());
  131. result = prime * result + ((getStatus() == null) ? 0 : getStatus().hashCode());
  132. result = prime * result + ((getRemark() == null) ? 0 : getRemark().hashCode());
  133. result = prime * result + ((getLastLoginTime() == null) ? 0 : getLastLoginTime().hashCode());
  134. result = prime * result + ((getLastLoginIp() == null) ? 0 : getLastLoginIp().hashCode());
  135. result = prime * result + ((getLastLocation() == null) ? 0 : getLastLocation().hashCode());
  136. result = prime * result + ((getSessionid() == null) ? 0 : getSessionid().hashCode());
  137. return result;
  138. }
  139. @Override
  140. public String toString() {
  141. StringBuilder sb = new StringBuilder();
  142. sb.append(getClass().getSimpleName());
  143. sb.append(" [");
  144. sb.append("Hash = ").append(hashCode());
  145. sb.append(", id=").append(id);
  146. sb.append(", appId=").append(appId);
  147. sb.append(", userid=").append(userid);
  148. sb.append(", username=").append(username);
  149. sb.append(", password=").append(password);
  150. sb.append(", role=").append(role);
  151. sb.append(", status=").append(status);
  152. sb.append(", remark=").append(remark);
  153. sb.append(", lastLoginTime=").append(lastLoginTime);
  154. sb.append(", lastLoginIp=").append(lastLoginIp);
  155. sb.append(", lastLocation=").append(lastLocation);
  156. sb.append(", sessionid=").append(sessionid);
  157. sb.append(", serialVersionUID=").append(serialVersionUID);
  158. sb.append("]");
  159. return sb.toString();
  160. }
  161. }

mapper层:

  1. package com.example.business.mapper;
  2. import com.example.business.bean.TpUserBean;
  3. import org.apache.ibatis.annotations.Param;
  4. import org.springframework.stereotype.Repository;
  5. /** * TpUserMapper继承基类 */
  6. @Repository
  7. public interface TpUserMapper extends MyBatisBaseDao<TpUserBean, Integer> {
  8. /** * 查询用户登录信息 * * @param userName 用户名 * @return */
  9. public TpUserBean selectUserNameAndPassword(@Param("userName") String userName);
  10. }

controller层:
在这里插入图片描述

html:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <link rel="stylesheet" href="layui/css/layui.css" type="text/css"></link>
  8. <style> * { padding: 0; margin: 0; } body { background-color: #ccc; background-size: 100% 100%; } .layui-container { width: 100%; } .layui-row { text-align: center; } .layui-row h1 { color: black; margin-top: 3%; font-size: 100px; font-family: FZShuTi; } .layui-form { background: white; padding: 12% 12% 12% 0; } #forget_passward { cursor: pointer; float: right; line-height: 36px; color: #666; } </style>
  9. <body>
  10. <div class="layui-container" onkeydown="Loginbtn()">
  11. <div class="layui-row">
  12. <h1>后 台 管 理 系 统</h1>
  13. </div>
  14. <div class="layui-row">
  15. <div class="layui-col-lg3 layui-col-md3 layui-col-sm3" style="margin-top: 5%;margin-left: 38%">
  16. <form id="formLogin" class="layui-form" action="login" onkeydown="" method="post">
  17. <div class="layui-form-item">
  18. <label class="layui-form-label">
  19. <i class="layui-icon layui-icon-username" style="font-size: 32px;"></i>
  20. </label>
  21. <div class="layui-input-block">
  22. <input type="text" id="username" name="username" required lay-verify="required" placeholder="请输入账户" autocomplete="off" class="layui-input">
  23. </div>
  24. </div>
  25. <div class="layui-form-item">
  26. <label class="layui-form-label">
  27. <i class="layui-icon layui-icon-password" style="font-size: 32px;"></i>
  28. </label>
  29. <div class="layui-input-block">
  30. <input type="password" id="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
  31. </div>
  32. </div>
  33. <div class="layui-form-item">
  34. <div class="layui-input-block" style="margin-left: 70px;text-align: left;">
  35. <input type="checkbox" id="remember" name="remember" title="记住我" lay-skin="primary">
  36. <span><a href="#" id="forget_passward">忘记密码?</a></span>
  37. </div>
  38. </div>
  39. <div class="layui-form-item" style="padding-left: 13%;">
  40. <div class="layui-btn-container">
  41. <button type="button" class="layui-btn" id="btnLogin" lay-submit style="width: 100%;">登 录
  42. </button>
  43. </div>
  44. </div>
  45. </form>
  46. </div>
  47. </div>
  48. </div>
  49. <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
  50. <script type="text/javascript" src="js/jquery.form.js"></script>
  51. <script type="text/javascript" src="layui/layui.js"></script>
  52. <script> layui.use('form', function () { var form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成功 //登录按钮点击事件 $("#btnLogin").click(function () { var username = $("#username").val(); var password = $("#password").val(); $("#formLogin").ajaxSubmit(function (data) { if (data.code != "200") { layer.alert(data.text, { offset: '150px', icon: 2}); } else { layer.msg("登录成功!", { offset: '150px'}); setTimeout(function () { window.location.href = "toUrl?page=main&"+$("#username").val();//将用户名也传过去 }, 1000); } }); }); var cookies = document.cookie.split(';'); //获取cookie function getCookie(mkey) { for (var i = 0; i < cookies.length; i++) { var kv = cookies[i].split('='); if (kv[0].trim() == mkey) { return kv[1].trim(); } } return ''; } //获取cookie回显 window.onload = function () { var username = getCookie("cookie_username"); var password = getCookie("cookie_password"); var remember = getCookie("cookie_remember"); if (remember == '1') { $("#username").val(username); $("#password").val(password); $("#remember").prop("checked", true); form.render();//重新渲染才能显示出来 // $.each($("input[type='checkbox']"), function (i, e) { // $(e).prop("checked", true); //false为取消√,true为勾选 // form.render();//重新渲染才能显示出来 // }) } } }); //按Enter登录 function Loginbtn() { if (window.event.keyCode == 13) { document.all('btnLogin').click(); } } </script>
  53. </body>
  54. </html>

interceptor(拦截器):

  1. package com.example.business.interceptor;
  2. import com.example.business.bean.TpUserBean;
  3. import org.slf4j.Logger;
  4. import org.slf4j.LoggerFactory;
  5. import org.springframework.web.servlet.HandlerInterceptor;
  6. import org.springframework.web.servlet.ModelAndView;
  7. import javax.servlet.http.HttpServletRequest;
  8. import javax.servlet.http.HttpServletResponse;
  9. import javax.servlet.http.HttpSession;
  10. /** * 登录拦截器 判断用户是否登录 */
  11. public class LoginInterceptor implements HandlerInterceptor {
  12. // 声明slf4j日志打印log
  13. private static final Logger log = LoggerFactory.getLogger(LoginInterceptor.class);
  14. @Override
  15. public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler)
  16. throws Exception {
  17. log.info("登录拦截器执行了...");
  18. // 获取请求的url
  19. String url = request.getRequestURI();
  20. // 判断url是否是公开地址(实际使用时将公开地址配置在配置文件中)
  21. // 这里公开地址是登录提交的地址和验证码是公开地址
  22. if (url.indexOf("toLogin") >= 0 || url.indexOf("validateCode") >= 0 || url.indexOf("login") >= 0
  23. || url.indexOf("app") >= 0 || url.indexOf("css") >= 0 || url.indexOf("images") >= 0
  24. || url.indexOf("js") >= 0 || url.indexOf("layui") >= 0) {
  25. log.info("公开地址" + url.toString() + ",放行");
  26. return true;
  27. }
  28. HttpSession session = request.getSession();
  29. // 从session取出用户信息
  30. TpUserBean tpUserBean = (TpUserBean) session.getAttribute("user");
  31. // 验证是否存在用户信息,存在即放行
  32. if (tpUserBean != null) {
  33. log.info("存在用户信息,放行");
  34. return true;
  35. }
  36. // 执行到这里表示用户身份需要认证,跳转登录页面
  37. log.info("用户信息不存在,用户未登录,身份验证失败!即将跳转跳转登录界面!!!");
  38. request.getRequestDispatcher("toLogin").forward(request, response);
  39. return false;
  40. }
  41. @Override
  42. public void postHandle(HttpServletRequest request, HttpServletResponse response, Object handler,
  43. ModelAndView modelAndView) throws Exception {
  44. }
  45. @Override
  46. public void afterCompletion(HttpServletRequest request, HttpServletResponse response, Object handler, Exception ex)
  47. throws Exception {
  48. }
  49. }

WebMvcConfigurer 配置拦截:

  1. package com.example.business.config;
  2. import com.example.business.interceptor.LoginInterceptor;
  3. import org.springframework.context.annotation.Configuration;
  4. import org.springframework.web.servlet.config.annotation.InterceptorRegistration;
  5. import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
  6. import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
  7. @Configuration
  8. public class LoginConfig implements WebMvcConfigurer {
  9. @Override
  10. public void addInterceptors(InterceptorRegistry registry) {
  11. //注册TestInterceptor拦截器
  12. InterceptorRegistration registration = registry.addInterceptor(new LoginInterceptor());
  13. registration.addPathPatterns("/**"); //所有路径都被拦截
  14. registration.excludePathPatterns( //添加不拦截路径
  15. "toLogin", //登录
  16. ".html", //html静态资源
  17. ".js", //js静态资源
  18. ".css" //css静态资源
  19. );
  20. }
  21. }

四、总结

  以上就是 SpringBoot 中使用 Cookie 实现记住登录功能,在项目中还算是比较实用的功能,希望能对正在阅读的你一点点帮助和启发

发表评论

表情:
评论列表 (有 0 条评论,363人围观)

还没有评论,来说两句吧...

相关阅读