在Ajax请求的中间更改页面页面、Ajax

由网友(一纸荒凉。)分享简介:如果我把一些Ajax请求会发生什么情况,并且请求返回之前的页面(比如遵循一些链接)立即改变?我的意思是我想XHR对象发送一个请求到的网站,但它被除去(因为页被改变)的响应检索之前,所以应该在哪里的响应被发送到?我问,因为我有一个奇怪的问题,我的网站这个问题。我有一个网页,通过Ajax请求加载从数据存储的职位。如果在加载...

如果我把一些Ajax请求会发生什么情况,并且请求返回之前的页面(比如遵循一些链接)立即改变?我的意思是我想XHR对象发送一个请求到的网站,但它被除去(因为页被改变)的响应检索之前,所以应该在哪里的响应被发送到?

我问,因为我有一个奇怪的问题,我的网站这个问题。我有一个网页,通过Ajax请求加载从数据存储的职位。如果在加载完成之前,我点击一个链接,我得到jQuery.ajax的onerror的叫!不知道为什么出现这种情况。

修改:这是我的电话阿贾克斯。在正常的情况下,成功的回调被调用。但是,当我点击一个链接,错误回调被调用!我在思索着什么,难道是因为数据格式应为JSON,但请求被切断,在中间,这样的数据被视为无效,导致jQuery来调用错误回调?不过,为什么请求被砍掉中间?

  $。阿贾克斯({
  类型:(args.rel ==异步|| args.rel ==对话)? GET:POST,
  网址:HREF,
  数据类型:JSON,
  数据:args.data? args.data:{} //发送{},以确保Content-Length头
  成功:功能(数据){
    如果(上下文)context.removeClass(ajax_wait);
    如果(args.hideonwait)$(args.hideonwait).show();
    如果(args.showonwait)$(args.showonwait).hide();
    如果(微调)remove_spinner(背景下,微调);
    handle_response(参数,背景,目标,数据);
  },
  错误:函数(XHR,状态,errorThrown){
    如果(上下文)context.removeClass(ajax_wait);
    如果(args.hideonwait)$(args.hideonwait).show();
    如果(args.showonwait)$(args.showonwait).hide();
    如果(微调)remove_spinner(背景下,微调);
    ajax_error(参数,环境,
               状态+ - + xhr.status,
               errorThrown? errorThrown:xhr.responseText);
  }
});
 

解决方案

关键是要检查响应头在XMLHtt prequest对象。如果没有响应报头(null或空字符串,取决于浏览器),服务器没有回应呢。这意味着用户中止。

  $。阿贾克斯({
    URL:URL到去 - 在这里,
    成功:函数(){
    },
    错误:函数(XHR,textStatus,errorThrown){
        如果(!isUserAborted(XHR)){
            的console.log(阿贾克斯错误)
        }
    }
});

功能isUserAborted(XHR){
  返回xhr.getAllResponseHeaders()!;
}
 
jQuery Ajax请求回来数据遍历显示在页面上

来源

What happens if I send some ajax request, and immediately change the page (say follow some link) before the request returns? I mean I suppose the XHR object sends a request to the website, but it is removed (since the page is changed) before the response is retrieved, so where should the response be sent to?

I am asking this question because I am having a strange problem with my website. I have a page that loads posts from the data store via an Ajax request. If before the load is complete I click on a link, I get the onerror of jQuery.ajax called! Not sure why that happens.

EDIT: This is my call to ajax. In the normal case, the success callback gets called. But when I click on a link, the error callback gets called! I am thinking about something, could it be because the data should be formatted as JSON, but the request is cut in the middle, so the data is considered invalid causing jQuery to call the error callback?! But then why the requests get cut in the middle?

$.ajax({
  type: (args.rel == "async" || args.rel == "dialog") ? "GET" : "POST",
  url: href,
  dataType: "json",
  data: args.data ? args.data:{}, // send {} to ensure Content-Length header
  success: function(data){
    if (context) context.removeClass("ajax_wait");
    if (args.hideonwait) $(args.hideonwait).show();
    if (args.showonwait) $(args.showonwait).hide();
    if (spinner) remove_spinner(context, spinner);
    handle_response(args, context, target, data);
  },
  error: function(xhr, status, errorThrown){
    if (context) context.removeClass("ajax_wait");
    if (args.hideonwait) $(args.hideonwait).show();
    if (args.showonwait) $(args.showonwait).hide();
    if (spinner) remove_spinner(context, spinner);
    ajax_error(args, context,
               status + "-" + xhr.status,
               errorThrown ? errorThrown : xhr.responseText);
  }
});

解决方案

The trick is to check the response headers in the XMLHttpRequest object. If there are no response headers (null or empty string, depending on the browser), the server did not respond yet. That means the user aborted.

$.ajax({
    url: "url-to-go-here",
    success: function() {
    },
    error: function(xhr, textStatus, errorThrown) {
        if(!isUserAborted(xhr)) {
            console.log("Ajax Error")
        }
    }
});

function isUserAborted(xhr) {
  return !xhr.getAllResponseHeaders();
}

Source

阅读全文

相关推荐

最新文章