我有一个AJAX请求，每5秒发出一次。但问题是在AJAX请求之前，如果之前的请求没有完成，我必须中止该请求，并做出一个新的请求。
我的代码是这样的，如何解决这个问题?
$(document).ready(
var fn = function(){
$.ajax({
url: 'ajax/progress.ftl',
success: function(data) {
//do something
}
});
};
var interval = setInterval(fn, 500);
);
当前回答
Create a function to call your API. Within this function we define request callApiRequest = $.get(... - even though this is a definition of a variable, the request is called immediately, but now we have the request defined as a variable. Before the request is called, we check if our variable is defined typeof(callApiRequest) != 'undefined' and also if it is pending suggestCategoryRequest.state() == 'pending' - if both are true, we .abort() the request which will prevent the success callback from running.
// We need to wrap the call in a function
callApi = function () {
//check if request is defined, and status pending
if (typeof(callApiRequest) != 'undefined'
&& suggestCategoryRequest.state() == 'pending') {
//abort request
callApiRequest.abort()
}
//define and make request
callApiRequest = $.get("https://example.com", function (data) {
data = JSON.parse(data); //optional (for JSON data format)
//success callback
});
}
你的服务器/API可能不支持中止请求(如果API已经执行了一些代码怎么办?)，但是javascript回调不会触发。这很有用，例如，当您向用户提供输入建议时，例如标签输入。
您可以通过添加错误回调的定义来进一步扩展此函数-如果请求被中止应该发生什么。
此代码片段的常见用例是在按键事件时触发的文本输入。您可以使用一个超时，以防止发送(一些)请求，您将不得不取消.abort()。
其他回答
jquery ajax方法返回一个XMLHttpRequest对象。您可以使用此对象取消请求。
XMLHttpRequest有一个abort方法，它会取消请求，但是如果请求已经发送到服务器，那么即使我们中止请求，服务器也会处理请求，而客户端不会等待/处理响应。
xhr对象还包含一个readyState，它包含请求的状态(UNSENT-0, open -1, HEADERS_RECEIVED-2, LOADING-3和DONE-4)。我们可以使用它来检查之前的请求是否已经完成。
$(document).ready(
var xhr;
var fn = function(){
if(xhr && xhr.readyState != 4){
xhr.abort();
}
xhr = $.ajax({
url: 'ajax/progress.ftl',
success: function(data) {
//do something
}
});
};
var interval = setInterval(fn, 500);
);
当您向服务器发出请求时，请先检查进度是否为空(或获取该数据)。如果它正在获取数据，则终止前一个请求并初始化新请求。
var progress = null
function fn () {
if (progress) {
progress.abort();
}
progress = $.ajax('ajax/progress.ftl', {
success: function(data) {
//do something
progress = null;
}
});
}
Create a function to call your API. Within this function we define request callApiRequest = $.get(... - even though this is a definition of a variable, the request is called immediately, but now we have the request defined as a variable. Before the request is called, we check if our variable is defined typeof(callApiRequest) != 'undefined' and also if it is pending suggestCategoryRequest.state() == 'pending' - if both are true, we .abort() the request which will prevent the success callback from running.
// We need to wrap the call in a function
callApi = function () {
//check if request is defined, and status pending
if (typeof(callApiRequest) != 'undefined'
&& suggestCategoryRequest.state() == 'pending') {
//abort request
callApiRequest.abort()
}
//define and make request
callApiRequest = $.get("https://example.com", function (data) {
data = JSON.parse(data); //optional (for JSON data format)
//success callback
});
}
你的服务器/API可能不支持中止请求(如果API已经执行了一些代码怎么办?)，但是javascript回调不会触发。这很有用，例如，当您向用户提供输入建议时，例如标签输入。
您可以通过添加错误回调的定义来进一步扩展此函数-如果请求被中止应该发生什么。
此代码片段的常见用例是在按键事件时触发的文本输入。您可以使用一个超时，以防止发送(一些)请求，您将不得不取消.abort()。
为什么要中止请求?
如果每个请求都超过5秒，会发生什么?
如果随请求传递的参数没有改变，则不应该中止请求。 例:-该请求是为了检索通知数据。 在这种情况下，最好的方法是只在完成前一个Ajax请求之后设置一个新请求。
$(document).ready(
var fn = function(){
$.ajax({
url: 'ajax/progress.ftl',
success: function(data) {
//do something
},
complete: function(){setTimeout(fn, 500);}
});
};
var interval = setTimeout(fn, 500);
);
您还应该检查readyState 0。因为当你使用xhr.abort()时，这个函数在这个对象中将readyState设置为0，并且你的if检查将始终为真- readyState !=4
$(document).ready(
var xhr;
var fn = function(){
if(xhr && xhr.readyState != 4 && xhr.readyState != 0){
xhr.abort();
}
xhr = $.ajax({
url: 'ajax/progress.ftl',
success: function(data) {
//do something
}
});
};
var interval = setInterval(fn, 500);
);
