Why are my XHR calls waiting for each other to return a response

Question

I have an iframe within a page that is continually polling the server for a session variable that is being actively updated by a "main" XHR.

So basically:

1. Main XHR runs and does its thing, updating a session variable as it runs. Usually takes a while, say more than 10 seconds.

2. While main XHR is running, I poll the server for the same session variable using parallel XHR requests. I'm supposed to update the front-end view whenever I get a response from my polling XHRs.

The problem is that the polling XHRs don't return anything until after the main XHR completes, at which point they are already useless of course. Is this really the expected behavior when dealing with sessions? Something like one session per client connection kind of restriction?

EDIT:

Here's some code snippet. The code is pretty big so I tried to trim it down to the bare essentials. It may have some syntax error as typed here as I just took out the important parts from my source code.

Generate iframe

(function($) {
    $(document).on('click','#proceed_form',function(){
        $('#upload_frame').show(); 
        function set () { 
            $('#upload_frame').attr('src','/productUpload/generateIframe'); 
        }
        setTimeout(set); 
    });
});

Iframe

<script type='text/javascript' src="/assets/js/src/vendor/jquery-1.9.1.js" ></script>

<script>

(function($) {

    $(document).ready(function() { 
        setInterval(function() 
        {
            $.get("/productController/getProgress", function(data)
            {
                $('#progress_container').fadeIn(100);   //fade in progress bar  
                $('#progress_bar').width(data +"%");    //set width of progress bar based on the $status value (set at the top of this page)
                $('#progress_completed').html(parseInt(data) +"%"); //display the % completed within the progress bar
            }
        )},500);  

    });

})(jQuery);

</script>


<div id="progress_container">
    <div id="progress_bar">
         <div id="progress_completed"></div>
    </div>
</div>

PHP Application

class productUpload extends CI_Controller{ 

    /**
     * Respond to XHR poll request
     *
     */
    public function getUploadedBytesToCloud()
    {
        session_start();
        $uploadedBytes = $_SESSION['bytes_uploaded'];
        echo json_encode(['uploadedBytes' => $uploadedBytes]);
    }

    /**
     * Main controller action
     * Uploads the images of a product to the cloud
     *
     */ 
     public function moveProductImagesToCloud($productId)
     {
          /**
           * Some logic to get the product image directory
           *
           */
           $productPath = '/assets/product/image_dir';
           $directoryMap = directory_map($productPath);
           foreach($directoryMap as $key => $file){
                 /**
                  * Upload file to AWS S3 bucket
                  */ 
                 $this->awsUploader->uploadFile(...);

                 $fileSize = $_SESSION['bytes_uploaded'];
                 $fileSize += filesize(getcwd()."/".$productPath."/".$file);
                 $_SESSION['bytes_uploaded'] = fileSize;
            }
      }

}

Answer 1

Yes, default session manager (using files) locks the session file when you do session_start and releases it when you do session_write_close (or the scripts ends). Meanwhile other scripts trying to access session, wait to the release. a detailed article here or at the manual session-write-close