PHP / AJAX Concurrent Session Misbehaving only in Chrome

TL;DR. The interesting piece without having to wade through the JS first: I’m incrementing a session counter, yet different requests are seeing the same value. This is only an issue in Chrome. In Firefox and Internet Explorer, every request sees a unique value.

I am trying to hit a web page (to process data) a bunch of times until I get a 204 HTTP code. I can do one ajax call at a time, by having the ajax call itself on success, and stopping on 204.

  • How can I update a c# parent page from a pop-up page without a full refresh
  • Simulate html form POST using ajax/jquery
  • jQuery mobile: Applying style after reloading content
  • how to make a sleep in javascript?
  • Embedding inline JS script instead of making an AJAX request. Why?
  • jQuery on success, reload the page and then append?
  • Since I want to do them faster, I have multiple “threads” in js all doing that. By that I mean multiple identical ajax calls are created, and they all start another one when they are completed, stopping on the 204 code.

    My relevant js looks like this:

    $(function() {
        // "thread" id
        var counter = 1;
    
        // run 3 "threads"
        generateThreads(3);
    
        function generateThreads(num) {
            if (num <= 0)
                return;
    
            doNextItem(counter++);
    
            // Pause before starting the next thread
            setTimeout(function() {
                    generateThreads(num-1);
                },
                50);
        }
    
        function doNextItem(thread) {
            $.ajax({
                url: URL,
                statusCode: {
                    200: function(data) {
                        logItem(data, thread);
                        doNextItem(thread); // call itself on the same thread
    
                    },
                    204: function(data) {
                        finished(); // done, don't recurse, end the thread
                    }
                }
            });
        }
    });
    

    And then in PHP, I’m incrementing an integer stored in Session and returning 204 when it is over a cutoff.

    if (!isset($_SESSION["nums"]))
    {
        $_SESSION["nums"] = 0;
    }
    else if ($_SESSION["nums"] > 10) {
        http_response_code(204);
        die();
    }
    echo json_encode(array("num" => $_SESSION["nums"]++));
    

    And then the weird part comes when I run it. logItem() in the javascript just prints to the console the thread id, then the number from php.

    Chrome:

    1: 0 
    2: 0 
    2: 1 
    1: 1 
    3: 1 
    2: 2 
    1: 2 
    3: 2 
    1: 3 
    2: 3 
    3: 3 
    3: 4 
    1: 4 
    2: 4 
    3: 5 
    2: 5 
    1: 5 
    2: 6 
    3: 6 
    1: 6 
    1: 7 
    2: 7 
    3: 7 
    1: 8 
    3: 8 
    2: 8 
    1: 9 
    2: 9 
    3: 9 
    2: 10
    1: 10
    3: 10
    

    Firefox / IE

    1: 0
    2: 1
    3: 2
    1: 3
    2: 4
    3: 5
    1: 6
    2: 7
    3: 8
    1: 9
    2: 10
    3: 11
    1: 12
    2: 13
    3: 14
    1: 15
    2: 16 
    3: 17 
    1: 18  
    2: 19 
    3: 20
    

    Why is chrome giving me the repeated values?

    UPDATE

    Something that is really fishy is that the number of duplicates for each number is exactly equal to the number of ajax calls that are going at the same time. Never less, never more, but exactly. If I run 6 ajax calls at the same time, they all get the same amount. If this was a timing issue, it wouldn’t be that consistent, especially because I offset the different ajax calls from each other. This implies to me that it is a javascript issue, not necessarily only a php issue as it appeared before.

    HUGE GAME CHANGER OF AN UPDATE
    This is only an issue in Chrome. Doesn’t happen in firefox or Internet Explorer. In Firefox and IE, every request gets a new value of the counter. Clearly this is a client side problem. Doing a little more research with this info brings up a lot of things about invalid requests doing a redirect that kills the session. Specifically a common scenario with the favicon.ico. All of my requests result in a success, and my favicon.ico is successfully loaded as well.

  • Load page while PHP is executing
  • CORS authentication with jQuery
  • $.getJSON returning undefined to success callback in IE9 and below
  • Cross-browser implementation of “HTTP Streaming” (push) AJAX pattern
  • Vue bind after AJAX partial loads?
  • How to use jQuery Ajax post response params
  • One Solution collect form web for “PHP / AJAX Concurrent Session Misbehaving only in Chrome”

    Chrome is caching the response because you’re sending the same request multiple times within a short timeframe. Forcing the ajax call to not cache the response should solve your problem. Try this:

    $.ajax({
        url: URL,
        cache: false,
        statusCode: {
    ...