5

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:

  1. AJAX call A requests thumbnail be generated.
  2. 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.
  3. 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?

random_user_name
  • 25,694
  • 7
  • 76
  • 115
  • set async:false in the first ajax request settings – Mir Gulam Sarwar Apr 15 '14 at 14:59
  • 2
    @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 Apr 15 '14 at 15:04
  • 1
    @cale_b have you looked at http://stackoverflow.com/questions/15686572/two-simultaneous-ajax-requests-wont-run-in-parallel?lq=1 and http://stackoverflow.com/questions/2540372/why-arent-my-jquery-ajax-requests-being-made-in-parallel?lq=1 ? – Shawn C Apr 15 '14 at 15:04
  • @ShawnC - good ones. I actually did not find them in my searches, and they show promise. – random_user_name Apr 15 '14 at 15:08

3 Answers3

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

Jono20201
  • 3,215
  • 3
  • 20
  • 33
  • 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? – random_user_name Apr 15 '14 at 15:11
  • 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 `$_SESSION`s – Jono20201 Apr 15 '14 at 15:14
  • @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 – Jono20201 Apr 15 '14 at 15:56
0

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

Mauro Valvano
  • 903
  • 1
  • 10
  • 21
  • Well that does not explain this, then. When this is happening, there are only two requests taking place. – random_user_name Apr 15 '14 at 15:06
  • @cale_b But maybe your server can only handle one simultanous request per user session – A. Wolff Apr 15 '14 at 15:07
  • @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... – random_user_name Apr 15 '14 at 15:10
0

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.

Sascha Hendel
  • 33
  • 4