由 JQuery 在 Chrome 中暂停和挂起的 ajax 请求
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/28010156/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Stalled and pending ajax requests by JQuery in Chrome
提问by Wasafa1
Once in a while, my Ajax calls (via JQuery 1.8) in my application are stuck with status "pending" for a long time (sometimes up to 17 minutes). I've googled it and all possible solutions didn't work:
有时,我的应用程序中的 Ajax 调用(通过 JQuery 1.8)会长时间处于“待处理”状态(有时长达 17 分钟)。我用谷歌搜索了一下,所有可能的解决方案都不起作用:
- I have no ad blocker installed.
- I've disabled the "predict network actions to improve page load performance" flag in Chrome.
- I've also added a query string to the Ajax call to make it unique (to disable any Chrome cache locking).
- 我没有安装广告拦截器。
- 我在 Chrome 中禁用了“预测网络操作以提高页面加载性能”标志。
- 我还在 Ajax 调用中添加了一个查询字符串以使其唯一(以禁用任何 Chrome 缓存锁定)。
Do you have a any idea how to solve this? Thanks.
你知道如何解决这个问题吗?谢谢。
In the example below, the request was pending for 17 minutes (verified with Fiddler that it was sent only after 17 minutes).
在下面的示例中,请求挂起 17 分钟(使用 Fiddler 验证它仅在 17 分钟后发送)。
GET http://www.mywebsite.com/foo/rest/publishers/1/packages?_=1421584749323 HTTP/1.1
Host: www.mywebsite.com
Connection: keep-alive
Accept: application/json, text/javascript, */*; q=0.01
X-Requested-With: XMLHttpRequest
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.99 Safari/537.36
Content-Type: application/json
Referer: http://www.mywebsite.com/foo/client/home
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8,he;q=0.6,ru;q=0.4
Cookie: JSESSIONID=C668509B5AFCDEBE9C9774C4721AFB9D;
aaassz="ddss"
See image:
见图片:
回答by michael
I have stumbled on exactly the same problem. As soon as I disabled:
我偶然发现了完全相同的问题。一旦我禁用:
Use a prediction service to load pages more quickly
使用预测服务更快地加载页面
Go Advanced Settings -> Privacy -> ca. 3rd checkbox, everything started to work as it should. I was unable to reproduce the error.
转到高级设置 -> 隐私 -> ca。第三个复选框,一切都开始正常工作。我无法重现该错误。
The jquery/ajax
poller works perfectly in Firefox. It's only Chrome - tested on Linux & Windows.
该jquery/ajax
轮询完美的作品在Firefox。它只是 Chrome - 在 Linux 和 Windows 上测试过。
It is not a perfect solution, as it won't affect users in the global sense - but maybe you are in the same situation as I - limited audience.
这不是一个完美的解决方案,因为它不会影响全球范围内的用户——但也许你和我的情况一样——受众有限。
回答by Tech Savant
You can try this.
你可以试试这个。
NOW UPDATED WITH ACTUAL WORKING CODE
现在更新了实际工作代码
(used some timezone code of my own so excuse the references to timezone)
(使用了我自己的一些时区代码,所以请原谅对时区的引用)
First initialize arrays and run your request counting logic
首先初始化数组并运行您的请求计数逻辑
var request = ( typeof request != 'undefined' && request instanceof Array ) ? request : [];
var pendingAjax = ( typeof pendingAjax != 'undefined' && pendingAjax instanceof Array ) ? pendingAjax : [];
Use .ajaxStartand .ajaxStopto keep track of the active requests.
使用.ajaxStart和.ajaxStop来跟踪活动请求。
var ajaxActive = 0;
$( document ).ajaxStart(function() {
ajaxActive++;
document.ajaxQueueFull = ajaxActive > 5;
});
$(document).ajaxStop(function() {
ajaxActive--;
document.ajaxQueueFull = ajaxActive > 5;
}
Create a function to build new requests
创建一个函数来构建新请求
function ajaxRequestNew(t, u, d, s) {
var instance = request.length + 1;
request[instance] = $.ajax({
method: t,
url: u,
data: {ajaxPost: d },
success: s
});
return instance;
}
Now create your request getting the instance number returned
现在创建您的请求以获取返回的实例编号
var instance = ajaxRequestNew('POST',
'js/ajax_timezone.php',
{ ajaxAction : "ajaxGetTimezone",
tzoffset : "0",
tztimezone: "America/New_York" },
function(data) { }
);
The $.ajax() function returns a XMLHttpRequest object. So we use a while loop to check when our ajax actually gets sent and aborts other active requests if the request is stalled.
$.ajax() 函数返回一个 XMLHttpRequest 对象。因此,我们使用 while 循环来检查我们的 ajax 何时实际被发送并在请求停止时中止其他活动请求。
while(request[instance] === null || (request[instance].readyState < 1 || request[instance].readyState > 4)) {
if (document.ajaxQueueFull) {
//abort existing requests
$.each(request, function(i,v) {
if (i !== instance) {
request[i].abort();
}
});
}
}
Push your request onto the stack
将您的请求推入堆栈
pendingAjax.push(request[instance]);
Create callbacks for your request
为您的请求创建回调
var timezoneFailCallback = function(data) {
console.log('fail');
console.dir(data);
};
var timezoneSuccessCallback = function(data) {
console.log('success');
console.dir(data);
};
use when to apply the callbacks
使用何时应用回调
$.when.apply($, pendingAjax).done( timezoneSuccessCallback ).fail( timezoneFailCallback);
The code may need a little tweaking for your app, but hopefully you get the idea. Let me know if you have any questions.
代码可能需要为您的应用程序稍作调整,但希望您能理解。如果您有任何问题,请告诉我。
回答by Bahram Ghahari
I know this is an old thread but I'm posting this for people that are scrambling to find some sort of answer for this. I had to deal with this head scratcher as well. My problem was due to Ad-blocker blocking an API call that had the word "coupon" in it. It was blocking the request while keeping it alive. after few blocks every request would automatically go to pending status since there were too many (I think around 6 or 7) live requests.
我知道这是一个旧线程,但我将其发布给那些争先恐后地为此寻找某种答案的人。我也不得不处理这个头疼的问题。我的问题是由于广告拦截器阻止了一个包含“优惠券”一词的 API 调用。它在保持请求的同时阻止请求。在几个块之后,每个请求都会自动进入待处理状态,因为有太多(我认为大约 6 或 7 个)实时请求。
Type chrome://net-internals/#events in your chrome address bar to inspect requests. That will give you a clearer overview of the problem. I attached two images that I captured While I was trying to figure this out.
在 Chrome 地址栏中键入 chrome://net-internals/#events 以检查请求。这将使您更清楚地了解问题。我附上了两张我在试图弄清楚这一点时捕获的图像。