使用 jQuery 中止 Ajax 请求

IT技术 javascript jquery ajax
2021-01-08 16:17:24

是否有可能使用 jQuery取消/中止我尚未收到响应的 Ajax 请求

6个回答

大多数 jQuery Ajax 方法都返回一个 XMLHttpRequest(或等效的)对象,因此您只需使用abort().

请参阅文档:

var xhr = $.ajax({
    type: "POST",
    url: "some.php",
    data: "name=John&location=Boston",
    success: function(msg){
       alert( "Data Saved: " + msg );
    }
});

//kill the request
xhr.abort()

更新: 从 jQuery 1.5 开始,返回的对象是名为 jqXHR 的原生 XMLHttpRequest 对象的包装器。该对象似乎公开了所有本机属性和方法,因此上面的示例仍然有效。请参阅jqXHR 对象(jQuery API 文档)。

更新 2: 从 jQuery 3 开始,ajax 方法现在返回一个带有额外方法(如 abort)的Promise,所以上面的代码仍然有效,尽管返回的对象不再是一个xhr请参阅此处3.0 博客

更新 3xhr.abort()仍然适用于 jQuery 3.x。不要假设更新 2是正确的。有关 jQuery Github 存储库的更多信息

您无法撤回请求,但可以设置超时值,超时后响应将被忽略。有关jquery AJAX 选项,请参阅此页面我相信如果超过超时时间,您的错误回调将被调用。每个 AJAX 请求已经有一个默认超时。

您还可以在请求对象上使用abort()方法,但是,虽然它会导致客户端停止侦听事件,但它可能不会阻止服务器处理它。

这是一个asynchronous请求,意味着一旦它被发送,它就会被发送出去。

如果您的服务器因AJAX请求而开始执行非常昂贵的操作,您能做的最好的事情就是打开服务器以侦听取消请求,然后发送一个单独的AJAX请求,通知服务器停止正在执行的任何操作。

否则,只需忽略AJAX响应。

在这种情况下,异步仅意味着请求不会中断脚本的流程。浏览器现在可以在请求完成之前提前中止请求。
2021-02-23 16:17:24

将您所做的调用保存在一个数组中,然后在每个调用上调用 xhr.abort()。

巨大的警告:您可以中止请求,但这只是客户端。服务器端可能仍在处理请求。如果你使用 PHP 或 ASP 之类的东西来处理会话数据,会话数据会被锁定,直到 ajax 完成。所以,要让用户继续浏览网站,必须调用session_write_close ()。这将保存会话并解锁它,以便其他等待继续的页面将继续进行。如果没有这个,几个页面可能会等待锁定被删除。

AJAX 请求可能不会按照它们开始的顺序完成。除了中止之外,您可以选择忽略所有 AJAX 响应,而不是中止

  • 创建一个计数器
  • 发起 AJAX 请求时增加计数器
  • 使用计数器的当前值来“标记”请求
  • 在成功回调中,将时间戳与计数器进行比较以检查它是否是最近的请求

粗略的代码概要:

var xhrCount = 0;
function sendXHR() {
    // sequence number for the current invocation of function
    var seqNumber = ++xhrCount;
    $.post("/echo/json/", { delay: Math.floor(Math.random() * 5) }, function() {
        // this works because of the way closures work
        if (seqNumber === xhrCount) {
            console.log("Process the response");
        } else {
            console.log("Ignore the response");
        }
    });
}
sendXHR();
sendXHR();
sendXHR();
// AJAX requests complete in any order but only the last 
// one will trigger "Process the response" message

jsFiddle 上的演示