Prevent jQuery AJAX call from waiting for previous call to complete

Question

I've searched SO, and every question seems to be asking how to wait for an AJAX call to complete. I am asking how not to wait for an AJAX call to complete.

I have an e-commerce site that does some heavy image manipulation via PHP. The manipulation is triggered via AJAX calls.

I am trying to speed up the user experience, so I have modified the code to first have PHP render a thumbnail (the operation completes quickly), then trigger a second AJAX call that tells PHP to render the full image (which can take a few minutes).

The "Add To Cart" operation is also an AJAX call. The problem is that the "Add to Cart" call is unable to complete until the previous AJAX call is completed.

Sequence:

AJAX call A requests thumbnail be generated.
The success callback for call A:
a. Displays / enables the "Add to Cart button"
b. Triggers AJAX call B, for the full image to be generated.
Clicking "Add to Cart" triggers AJAX call C, which does not complete until call B completes.

Relevant javascript:

/** Call A - make call for thumbnail generation **/ $.ajax({ url: 'index.php?route=decorable/image/thumbnail', type: 'post', data: image_data, dataType: 'json', success: function(json) { if (json['success']) { $('#button-cart').show(); /** Call B - make call for *full* layout generation **/ $.ajax({ url: 'index.php?route=decorable/image', type: 'post', data: image_data, dataType: 'json' }); }); /** Call C - this AJAX call starts, but does not complete, until call B completes **/ $('#button-cart').click(function() { $.ajax({ url: 'index.php?route=checkout/cart/add', type: 'post', data: cart_data, dataType: 'json', success: function(json) { if (json['success']) { $('.success').fadeIn('slow'); } } }); });

Am I misunderstanding, or should call C be able to complete even if call B is not complete?

If you believe that the PHP is holding up the experience, then is there a good way for to me to trigger PHP to begin executing, but still send the response back for the thumbnail AJAX call?

@janina In 99.99% of use case, ajax should be async, and i don't see how it could fix OP issue which looks like a server side issue, handling more than one request at a time. EDIT: ok, i see how it could fix OP's issue but still, he shouldn't use it — A. Wolff
– A. Wolff, Commented Apr 15, 2014 at 15:04
@cale_b have you looked at stackoverflow.com/questions/15686572/… and stackoverflow.com/questions/2540372/… ? — Shawn C
– Shawn C, Commented Apr 15, 2014 at 15:04
@ShawnC - good ones. I actually did not find them in my searches, and they show promise. — random_user_name
– random_user_name, Commented Apr 15, 2014 at 15:08

Jono20201 · Accepted Answer · 2014-04-15 15:00:17Z

7

In my experience this was caused by PHP sessions been used, when you're sure in the code (all ajax requests) that you will not have to modify sessions then you should call:

session_write_close()

This will then allow other requests to be made simultaneously.

Further reading: http://www.php.net/manual/en/function.session-write-close.php

answered Apr 15, 2014 at 15:00

Jono20201

3,2053 gold badges22 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

random_user_name Over a year ago

Where would you place this bit of code? Are you referring to the "main" PHP page that is making the calls, or the PHP functions that are reponding to the calls?

Jono20201 Over a year ago

I am referring to the PHP that is responding to the calls. You'd place that function as soon as possible in the code (but only after you're 100% sure you're not going to be modifying any $_SESSIONs

Jono20201 Over a year ago

@cale_b You should have seen my face when I discovered how to fix this exact issue, I had been trying to figure it our for around a year :P

Mauro Valvano · Accepted Answer · 2014-04-15 15:06:16Z

0

Most browsers support at max two async request at time. You can do nothing.

edited Apr 15, 2014 at 15:06

answered Apr 15, 2014 at 15:01

Mauro Valvano

9331 gold badge10 silver badges22 bronze badges

3 Comments

random_user_name Over a year ago

Well that does not explain this, then. When this is happening, there are only two requests taking place.

A. Wolff Over a year ago

@cale_b But maybe your server can only handle one simultanous request per user session

random_user_name Over a year ago

@A.Wolff - agreed. I'm seeing that in other answers, and in the comments posted to the question. I am trying to see if I can utilize the session_write_close() technique...

Sascha Hendel · Accepted Answer · 2017-01-11 15:55:22Z

Be aware, that only applying session_write_close() [answer of Jono20201] may not resolve the problem, if You have enabled output buffering (default in PHP 7+). You have to set output_buffering = Off in php.ini, otherwise session won't be closed immediately.

Collectives™ on Stack Overflow

Prevent jQuery AJAX call from waiting for previous call to complete

3 Answers 3

3 Comments

3 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

3 Comments

Comments

Linked

Related