How can i stop ajax request (don't wait untill response come)?

Question

If I use Ajax to send request and this request take long time ..... if I want to send anther request what should I do?

the current behaviour the second request

Answer 1

Browser allows you to handle only limited amount of requests to same host at time (2 or 3 as I remember, depending on browser).

Workaround on requests count is to make fake domains - like img1.domain.com, img2.domain.com, etc. leading to the same host and randomly use them in requests. Then you can just make requests you need. Domains count should be chosen depending on requests quantity in order to keep in bounds - 2 requests per domain. Otherwise 3rd request will wait until one of active finishes.

It allows you to receive responses from all your requests. For example, Google uses it to make images load faster.

EDIT:

Example: you have http://yourhost.com/ and alias http://alias.yourhost.com which points to the same place. Then:

$.ajax
({
    type: "GET",
    url: 'http://yourhost.com/somescript.php',
    success: function (html)
    {
       // do some thing  
    }
});

and then

$.ajax
({
    type: "POST",
    url: 'http://alias.yourhost.com/somescript2.php',
    success: function (html)
    {
       // do some thing else  
    }
});

Answer 2

The XMLHttpRequest object has an abort function. You can use setTimeout to abort a request that is taking too long.

EDIT: In the case you do not want to use a timer, and a new event occurs that should abort the prior request, then the event handler should do the following

if(!this.request) return;  // request contains the XMLHttpRequest
this.request.onreadystatechange = function() {};
if(this.request.readyState != 4) {
    this.request.abort();
}

Then after that you can create the new XMLHttpRequest object.

Answer 3

Defining the ajax request variable:

var xhr;

Making the ajax call:

xhr = $.ajax(...);

Aborting the ajax call:

xhr.abort();

Answer 4

I have been working on this many ways and I feel I found a working solution. I had a caching process that was causing a page to hang until done (average 5 seconds). Yes this is better suited as a CRON job, but I needed to create caching process for the user without knowing the environment they are using for my CMS. What I had done: Create the call within a variable and then remove it by a hard delete. By deleting this it seems to be removing the wait. This "hack" seemed to pull the wait from 5 second average to a 325ms wait.

var ignore = $.ajax({
    url:something/here.php,
    type: "GET",
    url: url1,
    success: function(){}
});
delete ignore;

Answer 5

It’s sort of a manual process, but you can add a global xhr object and test it on each request. If the readystate is "loading", abort it:

var xhr;
var loadUrl = function(url) {
    if ( xhr && xhr.readyState > 0 && xhr.readyState < 4 ) {
        // there is a request in the pipe, abort
        xhr.abort();    
    }
    xhr = $.get(url, function() {
        console.log('success', this);
    });
};

loadUrl('/ajax/');