浏览器偶尔中止Ajax请求而不返回任何错误

时间:2013-05-14 03:16:31

标签: javascript jquery ajax symfony xmlhttprequest

在我的项目中PHP Symfony 2)我在每个页面都做了很多Ajax次请求。我遇到了很多问题,因为它看起来像浏览器(在Google ChromeFirefox中测试)正在中止请求而不会给我一个错误。我已经做了一个干净的页面来测试可能导致此问题的原因并且错误仍然存​​在。我在for循环中尝试了10个请求的测试(我相信我们没有任何问题,对吧?)。

这是我的代码:

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Test page</title>
    </head>
    <body>Test page.
        <script type="text/javascript" src="/js/compressed_jquery-1.8.2.min_1.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                for (var i = 0; i < 10; i++) {
                    $.get('/i18n/javaScript/pt.json', function(data) {
                        console.log(data);
                    });
                }
            });
        </script>
    </body>
</html>

以下是Firebug中请求结果的屏幕截图:

Ajax requests screenshot

如您所见,某些请求已完成,而其他请求未完成。有时浏览器会完成所有10个请求而不会出错。可能导致这种情况的原因是什么?


我已经测试了所有解决方案,但我很确定它是Windows,Apache或PHP配置问题。今天我在我的机器中配置VM VirtualBox运行Ubuntu 13.04(Raring Ringtail)和Apache 2.2 + PHP,并且没有错误发生,证明这与{{3}无关},JavaScript或PHP代码。我不确定这是配置问题。如何发现此配置?

4 个答案:

答案 0 :(得分:4)

可以满足您的需求,逐个发送请求应避免服务器拒绝某些并行请求:

TEST IT

$(document).ready(function () {
    var tot = 30; //to simulate 30 requests
    (function request(i){
        if(i === tot) return;
        $.get('/echo/html/?'+i, function (data) {
            console.log("success");
        }).always(function() { request(++i) });
    })(0);
});

答案 1 :(得分:2)

我认为您的服务器响应时间过长,浏览器超时。可能是浏览器只有两个到服务器的开放连接,并且当前两个花费的时间太长时,正在中止最后的8/10。我会检查你的服务器日志以确认这一点。

当服务器看到/i18n/javaScript/pt.json的请求时,它正在做什么?四秒钟很长一段时间。尝试抓取一些静态内容,如图片或静态HTML而不是pt.json,看看是否能解决问题。

如果您需要进行大量计算才能生成pt.json,是否可以进行缓存?它非常大吗?你在使用Apache吗?

答案 2 :(得分:2)

您可以使用全局对象序列化请求:

function AjaxRequester() {
    this.queue = [];
}

AjaxRequester.prototype.doRequest(request){
    if (this.queue.length>0){
        this.queue.push(request)
    }
    else 
       handleRequest(request)
}

AjaxRequester.prototype.handleRequest(request){
    /* actually handle ajax request, on complete inspect 
       queue and if not empty recall this method on the first
       element */
}

requester = new AjaxRequester();

进入你的代码,做

requester.doRequest(yourRequest);

答案 3 :(得分:0)

如果这是一个缓存问题,那么你可以试试这个:

在页面标题中添加以下标记。这将阻止浏览器缓存任何数据。

<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1990 12:00:00 GMT" />

这将禁用大多数浏览器中的缓存,并且在每次刷新时都会获取您的数据,因为没有缓存,

还有一件事。您的数据在循环中被调用...我可以说它是一个具有相同请求的连续调用,因此该请求可能被视为重复请求,并可能被服务取消;如果一次又一次地发送相同的请求,那么可能会被视为大量请求......

尝试在调用时添加一些东西,比如这个..

for (var i = 0; i < 10; i++) {
    $.get('/i18n/javaScript/pt.json?v='+i, function(data) {
        console.log(data);
    });
}

用某些东西处理请求。试试看它是否有效..

如果正在使用jQuery调用open(),它是内置的,它会产生效果。

请参阅Stack Overflow旧帖子 How to solve Firebug’s “Aborted” messages upon Ajax requests?

我相信这会给你积极的解决方案......