如何在未完成时从ajax触发的PHP调用获取更新？

Question

Is there a way to get updates from a PHP process while it's not finished and it has been called by ajax? By updates i mean flushed output from the PHP script.

var proc;
$('#start').click(function () {
proc = $.ajax({
        type: 'POST',
        url: 'execute.php',
        // getData function that will get me updated data
        getData: function (update){
alert(update);
}
});
});

UPDATE: Lets say we want to get that echo before this ends.

execute.php

<?php
$progress = 0;
while(1){
$progress++;
    echo $progress;
flush();
    sleep(5);
    if($progress == 100){
        break;
}
}
?>

FINAL:

myScript.js

var strongcalcs;
var source;
$('#start').click(function () {
strongcalcs = $.ajax({
        type: 'POST',
        url: 'execute.php',
        beforeSend: function () {
rpm_percent();
},
        success: function(result){
source.close();
},
        complete: function () {
source.close();
},
        error: function () {
source.close();
}
});
});
 
function rpm_percent() {
    source = new EventSource("execute.php");
    if(typeof(EventSource) !== "undefined") {
        source.onmessage = function(event) {
            console.log(event.data);
};
    } else {
        alert("nono");
}
}

execute.php

<?php
$coco = 0;
function sendMsg($msg, &$coco) {
    echo "id: " . $coco . "
";
    echo "data: " . $msg;
    echo "
";
    echo "
";
ob_flush();
flush();
$coco++;
}
 
header("Content-Type: text/event-stream");
header("Cache-Control: no-cache");
$progress = 0;
while(1){
sendMsg($progress++, $coco);
ob_flush();
flush();
    sleep(5);
    if($progress == 100){
        break;
}
}
?>

Answer 1

I've in the past used Server Sent Events for this (https://www.w3schools.com/html/html5_serversentevents.asp). Internet Explorer is not supported out of the box, but there are polyfills that can solve the issue.

I think Websockets do something similar but don't have experience with those myself.