Browser aborting Ajax requests sporadically without returning any errors [duplicate]

问题

In my project (PHP with Symfony 2) I do a lot of Ajax requests in every page. I'm having a lot of problems with them, because it looks like browsers (tested in Google Chrome and Firefox) are aborting requests without giving me an error. I've done a clean page to test what can be causing this issue and the error persists. I've tried a test doing 10 requests inside a for loop (I believe we don't have any problem with it, right?).

Here is my code:

<!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>

And here is a screenshot of requests result in Firebug:

As you can see, some requests are completed and others are not. Sometimes the browser completes all 10 requests without errors. What can be causing this?

I've tested all the solutions, but I'm pretty sure it's a Windows, Apache or PHP configuration issue. Today I've configured a VM in my machine with VirtualBox running Ubuntu 13.04 (Raring Ringtail) with Apache 2.2 + PHP, and NO ERRORS happenned, proving that is nothing with my JavaScript, HTML or PHP code. I am not sure it is a configuration issue. How do I discover this configuration?

回答1:

Could fit your needs, sending request one by one should avoid server rejecting some parallel requests:

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);
});

回答2:

You can serialize requests with a global object:

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();

into your code, do

requester.doRequest(yourRequest);

回答3:

I think your server is taking too long to respond and the browser is timing out. It may be that the browser will only have two open connections to the server and is aborting the last 8/10 when the first two take too long. I would check your server logs to confirm this.

What is the server doing when it sees a request to /i18n/javaScript/pt.json? Four seconds is a long time. Try fetching some static content like an image or some static HTML instead of pt.json and see if that fixes the problem.

If you need to do a lot of computation to produce pt.json, can it be cached? Is it very large? Are you using Apache?

回答4:

If this is a cache issue then you may try this:

Add the following markup in your page's header. That will prevent the browser from caching any data.

<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" />

This will disable caching in most of the browsers, and your data will be fetched on each refresh as there is no cache,

One more thing. Your data is called in loop... I can say it is a continuous call with same request, so the request might be considered as a duplicate request and may get cancelled by the service; As that might be considered as a flood of requests if the same request is sent again and again...

Try adding something while calling, like this..

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

And handle the request with something. Try and see if it works..

If calling open() using, as you are using, jQuery, it's built in, and it will have an effect.

Refer an Stack Overflow Old Post How to solve Firebug’s “Aborted” messages upon Ajax requests?.

I am sure this will give you positive lead towards solution...

来源：https://stackoverflow.com/questions/16534543/browser-aborting-ajax-requests-sporadically-without-returning-any-errors

标签

javascript

jquery

ajax

symfony

xmlhttprequest