单点登录Session超时，Ajax请求不能正常跳转到登录界面

Posted 2021-04-15 元页石

场景描述

前端：nui+jQuery

     nui是前端mini jquery ui的别名，除了增加数据字典的组件，其他均一样；

后端：EOS

     EOS是普元信息技术股份有限公司的快捷开发平台的产品；

现有企业内部管理系统，前后端的交互，80%均采用ajax来实现的。

这种模式的优势在于：

• 减少前后端不必要的交互（全部刷新）

• 减轻服务器端的压力（合理使用客户端机器的资源）。

有利必有弊，弊端：

• 部分刷新，session超时后，后端拦截到ajax的请求，会redirect到登录界面，但是Ajax的核心功能并非处理跳转。

---

解决方案：

分两步进行解决

• 在拦截器中区别Ajax请求和正常的http请求。

• jQuery中的全局方法进行统一处理（每个ajax增加，工作量太大）。

  
  

第一步：区别ajax

如图，ajax请求中，

包含X-Requested-With的请求头,

而且其value固定为XMLHttpRequest

伪代码如下：

if(session==null){

     //ajax请求的

     if(X-Requested-With.equals('XMLHttpRequest')){

        返回跳转到登录页面的标识 

     }else{//其他

       直接跳转到登录页面

    }

}

第二步：jquery的全局方法

 $(document).ajaxComplete(function (evt, request, settings) {

        var text = request.responseText;

        //获取第一步返回的跳转到登录页面的标识

         if (text == "logout") {

               top.location = '/login.html';

               //如果使用了iframe，需要设置其父frame的链接为登录页面

         }

   })

必须要放在统一的入口，才能避免每个ajax请求增加该方法。

我是单独写了一个js文件，然后在统一应用的nui.js中增加这个js的引用。