jQuery - Ajax async not working?

Question

I have a simple Ajax call in jQuery like this...

    function my_call(identifier) {

    var settings = {
        "async": true,
        "crossDomain": true,
        "url": "http://www.example.com/?" + identifier,
        "method": "GET",
        "headers": {
        "Accept": "application/json",
    },

    "processData": false,
    "contentType": false,
    "dataType"   : "json",
    "mimeType": "multipart/form-data",
    }

    $.ajax(settings).done(function (response) {         
        console.log(response);
    });

}

And I am calling it 10 times for different identifiers like this...

my_call(1);
my_call(2);
my_call(3);
my_call(4);
my_call(5);

I have set async to true so had assumed these calls would all happening at the same time, but instead I seem to get the results print to the console one after the other with a bit of a delay in between.

Am I doing it correctly, or is there a different way to call the function? I am trying to reduce the time it takes to return the results.

_"I have set async to true so had assumed these calls would all happening at the same time"_ You do understand what asynchronous means don't you? — j08691, Aug 09 '18 at 22:10
Don't have to set `async:true`. That is default. If there is much of a delay it is likely server side related. Inspect the actual requests in browser dev tools network — charlietfl, Aug 09 '18 at 22:10
JavaScript in the browser is single-threaded so they're not happening at the same time. — Dave, Aug 09 '18 at 22:11
@charliefl : which ones in particular are redundant options? — fightstarr20, Aug 09 '18 at 22:15
Look at the network tab to get a better idea of the order and timing of the calls. — nurdyguy, Aug 09 '18 at 22:15
You aren't sending any data so processing is pointless as is mimeType and contentType on a GET there is no content sent and crossDomain is really only for testing jsonp — charlietfl, Aug 09 '18 at 22:16
@charlietfl : Thanks for that, obvious now you spelled it out! — fightstarr20, Aug 09 '18 at 22:25
For what you are doing `$.getJSON( "http://www.example.com/?" + identifier).done(function (response) {...` will do what you need. Is a shorthand wrapper for `$.ajax` — charlietfl, Aug 09 '18 at 22:26
Chnage your server script so that it sleeps for a random number of seconds. Then you'll see that the log messages happen out of order. — Barmar, Aug 09 '18 at 22:48

score 1 · Answer 1 · answered Aug 09 '18 at 22:16

The AJAX function calls are occcurring one after another. They are still asynchronous as they are not waiting for the previous AJAX calls to finish before executing (which would be the behavior had you set async to false). AJAX calls are supposed to work that way; you send a request over to the server and wait for the response to execute a function. To make the AJAX calls finish faster, you will have to optimize your server-side code (if possible). Also, it is unnecessary to set the async property to true as that is the default. Javascript is single-threaded, so you cannot execute many functions at the exact same time.

jQuery - Ajax async not working?

1 Answers1