今天发现,当使用Ajax请求时,如果后台进行重定向到其他页面时是无法成功的,只能在浏览器地址栏输入才能够实现重定向。

Ajax默认就是不支持重定向的,它是局部刷新,不重新加载页面。

需要实现的功能是,后台网关拦截请求,看请求中是否存在token.如果不存在就跳转到登录页面。因为大多数请求都是使用Ajax.一开始发现无法进行重定向,每次都是返回到Ajax的结果处理函数。最终的解决办法如下,需要后台和前端进行处理。

后台:

/**
*功能描述
* @author lgj
* @Description 重定向工具类
* @date 2/27/19
*/
@Slf4j
public class RedirecUtil { /**
*功能描述
* @author lgj
* @Description 重定向
* @date 2/27/19
* @param:
* @return:
*
*/
public static void redirect(RequestContext ctx, String redirectUrl){ try{
//如果是Ajax请求
if("XMLHttpRequest".equals(ctx.getRequest().getHeader("X-Requested-With"))){
log.debug("ajax redirect");
sendRedirect(ctx.getResponse(),redirectUrl);
}
//如果是浏览器地址栏请求
else { log.debug("normal redirect ");
ctx.getResponse().sendRedirect(redirectUrl);
}
}
catch(Exception ex){
ex.printStackTrace();
} } /**
*功能描述
* @author lgj
* @Description Ajax请求时重定向处理
* @date 2/27/19
* @param:
* @return:
*
*/
private static void sendRedirect(HttpServletResponse response, String redirectUrl){
try {
       //这里并不是设置跳转页面,而是将重定向的地址发给前端,让前端执行重定向
//设置跳转地址
response.setHeader("redirectUrl", redirectUrl);
//设置跳转使能
response.setHeader("enableRedirect","true");
response.flushBuffer();
} catch (IOException ex) {
log.error("Could not redirect to: " + redirectUrl, ex);
}
}
}

前端处理


第一种方式:使用Ajax的complete方法


 $.ajax({
type: "post",
url: "/auth/token/check",
success: function(data,status){
console.log("/token/check 返回 status : "+status) },
//请求完成调用
(XHR, TS){
console.log("complete");
var url = XHR.getResponseHeader("redirectUrl");
console.log("redirectUrl = " + url); var enable = XHR.getResponseHeader("enaleRedirect");
                console.log("enableRedirect = " + enable);
                if((enable == "true") && (url != "")){ 

                    var win = window; 

              while(win != win.top){
      win = win.top;
        }
         win.location.href = url;
          }
      },
    });
})

但是上面有个问题就是,每个ajax都需要编写 comlete 方法,代码复用率低。

第二种方法 : 使用全局的complete方法

ajax请求

 $("#NON-TOKEN").click(function () {
$.ajax({
type: "post",
url: "/auth/token/check",
success: function(data,status){
console.log("/token/check 返回 status : "+status) }, });

全局处理

注意这参数(event, xhr, settings)不能少,否则会报错。

//每一个Ajax 请求完成之后都会执行。
$(document).ajaxComplete(function (event, xhr, settings) {
console.log("ajaxComplete ")
redirectHandle(xhr);
})
function  redirectHandle(xhr) {

  //获取后台返回的参数
var url = xhr.getResponseHeader("redirectUrl");
console.log("redirectUrl = " + url);
var enable = xhr.getResponseHeader("enableRedirect"); if((enable == "true") && (url != "")){
var win = window;
while(win != win.top){
win = win.top;
}
win.location.href = url;
}
}

也可以将上述前端代码放入一个js文件中,在需要进行重定向的时候引入即可,便可以实现更高的代码复用率。

redirect.js

function  redirectHandle(xhr) {

    var url = xhr.getResponseHeader("redirectUrl");
console.log("redirectUrl = " + url); var enable = xhr.getResponseHeader("enableRedirect"); if((enable == "true") && (url != "")){
var win = window;
while(win != win.top){
win = win.top;
}
win.location.href = url;
} } $(function () { $(document).ajaxComplete(function (event, xhr, settings) {
console.log("ajaxComplete adffdafadsaf")
redirectHandle(xhr);
})
})

引入js文件,src根据据实际情况设置。

<script src="/common/redirect.js"></script>

解决Ajax请求时无法重定向的问题的更多相关文章

  1. 解决由AJAX请求时forms认证实效的重新认证问题

    前言: 当用AJAX请求一个资源时,服务器检查到认证过期,会重新返回302,通过HTTP抓包,是看到请求了登录页面的,但是JS是不会进行跳转到登录页面. 使用环境: ASP.NET MVC 4 JQU ...

  2. SpringMVC学习系列-后记 解决GET请求时中文乱码的问题

    SpringMVC学习系列-后记 解决GET请求时中文乱码的问题 之前项目中的web.xml中的编码设置: <filter> <filter-name>CharacterEnc ...

  3. AJAX请求时status返回状态明细表(转)

    转自:http://www.cnblogs.com/wangking/p/6530904.html AJAX请求时status返回状态明细表 readyState的五种状态2010-03-04 18: ...

  4. 解决Ajax请求跨域问题

    from:https://blog.csdn.net/wang379275614/article/details/53333775 上篇文章提到,由于浏览器的同源策略,使得,AJAX请求只能发给同源的 ...

  5. AJAX请求时status返回状态明细表

    AJAX请求时status返回状态明细表 readyState的五种状态2010-03-04 18:24对于readyState的五种状态的描述或者说定义,很多Ajax书(英文原版)中大都语焉不详 在 ...

  6. 只要发生ajax请求时加载旋转的按钮

    定义一个变量 全局 c 只要发生ajax时给c++ 当ajax请求success或者error时,c--; 对加载的按钮添加个事件   监听 c  如果c得值没变化  则隐藏按钮   如果变化了则显示 ...

  7. 解决ajax请求(SpringMVC后台)响应415/400/405错误

    解决ajax请求(SpringMVC后台)响应415/400/405错误 后端代码 bean public class user { private String username; private ...

  8. 解决ajax请求默认不支持重定向问题

    1,Ajax默认是不支持重定向的,只局部刷新数据,不跳转页面. 2,后台代码处理: @RequestMapping("/updateCurrentUser") public Str ...

  9. $.ajax 请求 拦截器 重定向 无效 解决办法

    在ajax 异步请求下 拦截器过滤器中使用 重定向 页面响应无效 我这里用的是springboot框架,用拦截器实现 对请求的拦截 ,session超时直接跳转到login.html页面. 后台代码: ...

随机推荐

  1. Linux内核中的算法和数据结构

    算法和数据结构纷繁复杂,但是对于Linux Kernel开发人员来说重点了解Linux内核中使用到的算法和数据结构很有必要. 在一个国外问答平台stackexchange.com的Theoretica ...

  2. 剑指Offer常见问题整理

    1 在一个二维数组中,每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序.请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数.(来自牛客网,剑指offer) ...

  3. JDK源码分析-String、StringBuilder、StringBuffer

    String类的申明 public final class String implements java.io.Serializable, Comparable<String>, Char ...

  4. SSH概念及常用操作汇总

    工作有一段时间了,经常用SSH登录远程机器,但对原理一直不是很了解,所以查阅了一些资料,写个小结. 一. SSH是什么? SSH的全称是Secure Shell, 是一种“用来在不安全的网络上安全地运 ...

  5. Spring的两种任务调度Scheduled和Async

    Spring提供了两种后台任务的方法,分别是: 调度任务,@Schedule 异步任务,@Async 当然,使用这两个是有条件的,需要在spring应用的上下文中声明<task:annotati ...

  6. 一起来读Netty In Action(一)

    Netty是一款异步事件驱动的网络应用程序框架,支持快速的开发可维护的高性能的面向协议的服务器和客户端.在网络编程中,阻塞.非阻塞.同步.异步经常被提到.同步(synchronous) IO和异步(a ...

  7. checkbox事件的变化

    <input type="checkbox" checked={this.state.checked} onChange={this.checkedChangeHandler ...

  8. 【bzoj4174】tty的求助 莫比乌斯反演

    Description Input 输入仅有一行. 第一行仅有两个正整数N,M 和一个实数 x.  Output 输出共1行,由亍结果过大,所以请输出上式对998244353 取模的结果. Sampl ...

  9. 51nod 1135 原根 就是原根...

    %%% dalao Orz ,筛素数到sqrt(n),分解ϕ(p),依次枚举判断就好了 #include<cstdio> #include<cstring> #include& ...

  10. 【链表】Bzoj1098[POI2007]办公楼biu

    Description FGD开办了一家电话公司.他雇用了N个职员,给了每个职员一部手机.每个职员的手机里都存储有一些同事的电话号码.由于FGD的公司规模不断扩大,旧的办公楼已经显得十分狭窄,FGD决 ...