How to flush PHP output buffer properly?

Question

I need PHP to stream output to Javascript but Javascript keeps the old responses and prints them like so...

Console logs:

[0]: Line to show.
[0]: Line to show.[1]: Line to show. 
[0]: Line to show.[1]: Line to show.[2]: Line to show.
[0]: Line to show.[1]: Line to show.[2]: Line to show.[3]: Line to show.
[0]: Line to show.[1]: Line to show.[2]: Line to show.[3]: Line to show.[4]: Line to show.

[0]: Line to show.[1]: Line to show.[2]: Line to show.[3]: Line to show.[4]: Line to show.Array
(
    [0] => [0]: Line to show.
    [1] => 
    [2] => 
    [3] => [1]: Line to show.
    [4] => 
    [5] => 
    [6] => [2]: Line to show.
    [7] => 
    [8] => 
    [9] => [3]: Line to show.
    [10] => 
    [11] => 
    [12] => [4]: Line to show.
    [13] => 
    [14] => 
)

So Javascript console logs state that the responseText is "saving" old responses. However, take a look at the array I saved in PHP and you can see that no previous echos are flushed to JS.

Javascript:

                $.ajax({
                    url: "../controller/controller.php", 
                    type: "POST",
                    data: {operation: 'rxMode'},
                    xhr: function(){
                        var xhr = $.ajaxSettings.xhr();
                        xhr.onprogress = function(e){ console.log(e.currentTarget.responseText); };
                        console.log(xhr);
                        return xhr;
                    }
                 });

PHP:

        $out = array();
        for ($i = 0; $i<5; $i++){
            echo "[$i]: Line to show.";
            array_push($out, ob_get_contents());
            ob_flush();
            array_push($out, ob_get_contents());
            flush();
            array_push($out, ob_get_contents());
            sleep(2);
        }
        print_r($out);

My desired responseText is

[0]: Line to show.
[1]: Line to show.
[2]: Line to show.
[3]: Line to show.
[4]: Line to show.

Edit: I do not want to remove the old responses rather I would prefer that Javascript only gives me my desired responseText.

removing the PHP array and print_r does not solve the problem, it is only for debug. — heyblackduck
– heyblackduck, Commented Mar 16, 2017 at 15:43
Maybe try clearing xhr var before the next response? Like with remove command. BUT You will have to remove var from xhr declaration. — user5147563
– user5147563, Commented Mar 16, 2017 at 15:48
not sure what you mean by removing the variable. It is in a jQuery ajax wrapper so deleting it would cause ajax to point to the wrong variable?? — heyblackduck
– heyblackduck, Commented Mar 16, 2017 at 15:57
What I mean is removing the variable containing data from request just when it is no longer needed. When ajax connects again, it will create new. You might need to recreate your ajax request, but well... I am not best in js and jquery, I'm just showing a way I used in one of my prev. projects. — user5147563
– user5147563, Commented Mar 16, 2017 at 16:02

Barmar · Accepted Answer · 2017-03-16 16:52:43Z

4

responseText always contains the entire response from the server. When you use the progress event, it contains the accumulated response so far, not just the incremental string added to the response in the most recent flush from the server.

Save the length of the previous response text in a variable, and then on subsequent calls just print the substring after that.

var responseLen = 0;
$.ajax({
    url: "../controller/controller.php", 
    type: "POST",
    data: {operation: 'rxMode'},
    xhr: function(){
        var xhr = $.ajaxSettings.xhr();
        xhr.onprogress = function(e){
            console.log(e.currentTarget.responseText.substr(responseLen)); 
            responseLen = e.currentTarget.responseText.length;
        };
        console.log(xhr);
        return xhr;
    }
 });

edited Mar 16, 2017 at 16:52

answered Mar 16, 2017 at 16:31

Barmar

789k57 gold badges554 silver badges669 bronze badges

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

4 Comments

heyblackduck Over a year ago

Thanks for the solution but I was hoping for an answer that solves the source of the problem and not the symptom. Sometime between PHP and my Apache server to Javascript something saves the old responses and it gets flushed to Javascript. Thankfully variables in JS do not have limits but if I made this server run for days and it kept streaming this string response in an infinite loop, it would get large very quickly...

Barmar Over a year ago

It's the browser saving it. responseText is the entire response received so far, not just the bit from the most recent flush in PHP.

Barmar Over a year ago

It sounds like you should be using something like WebSockets rather than XHR.

heyblackduck Over a year ago

Websocket is probably the best option here, thank you.

Collectives™ on Stack Overflow

How to flush PHP output buffer properly?

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related