1.問題出現(xiàn)的場(chǎng)景與解決

實(shí)現(xiàn)一個(gè)登錄攔截器，重寫doFilter方法，判斷用戶的登錄狀態(tài)，在用戶長(zhǎng)時(shí)間未操作或者異地登錄時(shí)前端進(jìn)行提示，完整代碼如下

  1 public class LoginValidateFilter implements Filter {
  2 
  3     private String errorMessage;
  4     private Logger log = LoggerFactory.getLogger(this.getClass());
  5 
  6     @Override
  7     public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse,
  8                          FilterChain chain) throws IOException, ServletException {
  9         try {
 10             HttpServletRequest request = (HttpServletRequest) servletRequest;
 11             HttpServletResponse response = (HttpServletResponse) servletResponse;
 12 
 13             String url = request.getRequestURI();
 14             if (isResourceRequest(url)
 15                     || isNotLoginValidate(url, request)) {
 16                 chain.doFilter(servletRequest, servletResponse);
 17                 return;
 18             }
 19             //判斷用戶是否在登錄狀態(tài)
 20             if (isLogin(request, response)) {
 21                 //更新session時(shí)間：心跳檢測(cè)的請(qǐng)求不更新
 22                 if (url.indexOf("/manage/session/isAlive.do") < 0) {
 23                     SessionUtil.updateSession(request);
 24                 }
 25                 chain.doFilter(servletRequest, servletResponse);
 26             } else {
 27                 SessionUtil.removeSession(request);
 28                 String path = request.getContextPath();
 29                 response.setContentType("text/html");
 30 //                String responsePage = "";
 32 
 33                 String responsePage = "";
 34                 response.getWriter().print(responsePage);
 35             }
 36         } catch (Exception e) {
 37             log.error("登錄過濾器異常:{}", e);
 38             throw new ServletException(e);
 39         }
 40     }
 41 
 42     private boolean isLogin(HttpServletRequest request, HttpServletResponse response) {
 43         Session session = SessionUtil.getSession(request);
 44         //未登錄
 45         if (session == null) {
 46             errorMessage = "";
 47             Session oldSession = SessionUtil.getOldSession(request);
 48             if (oldSession != null) {
 49                 errorMessage = "您的賬號(hào)在異地登錄(" + oldSession.getIp() + ")，如非授權(quán)，建議修改密碼";
 50             }
 51             return false;
 52         }
 53         //登錄超時(shí)
 54         if (SessionUtil.isLoginTimeout(session)) {
 55             SessionUtil.removeSession(session);
 56             errorMessage = "因長(zhǎng)時(shí)間未操作，系統(tǒng)已自動(dòng)退出，請(qǐng)重新登錄";
 57             return false;
 58         }
 59         return true;
 60     }
 61 
 62     /**
 63      * 不用過濾的額外配置
 64      * 沒有登錄時(shí)，有些請(qǐng)求是必須的，因此不用過濾
 65      *
 66      * @param url
 67      * @param request
 68      * @return
 69      */
 70     private boolean isNotLoginValidate(String url, HttpServletRequest request) {
 71         for (String path : GridProperties.NOT_VALIDATE_PATH) {
 72             if (url.startsWith(request.getContextPath() + path)) {
 73                 return true;
 74             }
 75         }
 76         return false;
 77     }
 78 
 79     /**
 80      * 資源請(qǐng)求
 81      *
 82      * @param url
 83      * @return
 84      */
 85     private boolean isResourceRequest(String url) {
 86         if (url.endsWith(".jpg") || url.endsWith(".gif")
 87                 || url.endsWith(".css") || url.endsWith(".js")
 88                 || url.endsWith(".png") || url.endsWith(".bmp")
 89                 || url.endsWith(".ico") || url.endsWith(".txt")
 90                 || url.endsWith(".apk") || url.endsWith("bootstrap.min.css.map")) {
 91             return true;
 92         }
 93         return false;
 94     }
 95 
 96     @Override
 97     public void destroy() {
 98         this.errorMessage = "";
 99     }
100 
101     @Override
102     public void init(FilterConfig filterConfig) throws ServletException {
103         this.errorMessage = "";
104     }
105 
106 }

第30-31行返回給前端返回提示信息，通過url進(jìn)行傳參進(jìn)行提示，前端頁(yè)面再進(jìn)行獲取，往往會(huì)出現(xiàn)亂碼和刷新頁(yè)面數(shù)據(jù)還在的問題，

考慮通過后端方式給前端傳回?cái)?shù)據(jù) 都沒有成功。

最后通過使用sessionStorage進(jìn)行傳遞參數(shù)，問題解決。

前端的主要處理代碼如下

　　　　 console.log(window.sessionStorage.getItem(errorMessage));
        var message = window.sessionStorage.getItem(errorMessage);
        if (message !=null) {
            $(".login-errorMsg").text(message);
            window.sessionStorage.removeItem("errorMessage");
        }else {
            $(".login-errorMsg").text("");
        }

2.認(rèn)識(shí)sessionStorage

通過瀏覽器的F12 我們可以看到如下界面

可以看到我們可以使用localStorage 和sessionStorage來存儲(chǔ)前端交互數(shù)據(jù)

sessionStorage簡(jiǎn)單的存取和讀取方式如下：

sessionStorage.setItem(testKey,這是一個(gè)測(cè)試的value值); // 存入一個(gè)值

window.sessionStorage.getItem(key); //取出一個(gè)值

sessionStorage.removeItem("key");//刪除某個(gè)key

sessionStorage.clear();//清除所有key/value

可以大膽推斷一下，localStorage 的使用方式應(yīng)該也是類似的，

具體的使用方法可以參考：https://www.cnblogs.com/polk6/p/5512979.html

https://developer.mozilla.org/zh-CN/docs/Web/API/Window/sessionStorage

https://www.cnblogs.com/minigrasshopper/p/8064367.html