Sorry if this topic already exists, but I couldn't find the solution. I have some calculations processed on server side. These calculations consists of several steps. I would like a response for each executed step. For instance, there are 5 steps in a task, and server must send me 5 responses:
- Step 1 is executed
- Step 2 is executed
- Step 3 is executed
- ...etc
I read a lot of forums and blogs, but I can't solve this problem. In my case I think it is better to use long polling in comet. I wrote a simple example of my task (posted below); it doesn't work. This task has button which starts the counter (from 1 to 11 with sleep 1 sec), then Ajax sends a requests. The server must give the accumulated text ($q_msg), clear this variable, and continue to accumulate another counts. But instead of this, server accumulates everything without any responses and at the end response all in an answer. So, where is my fault? Please, assist me.
HTML:
<script type="text/javascript">
var request;
function createXMLRequest() {
request = new XMLHttpRequest();
return request;
}
//start counter
function comet_btnStart() {
document.getElementById('count1').innerHTML = "";
createXMLRequest();
var param = "btnStart=pusk";
request.open("GET", "counter.php?" + param, true);
request.onreadystatechange = comet_response;
request.send(null);
}
//get values
var q = "";
function comet() {
createXMLRequest();
var param = "q=" + q;
request.open("GET", "counter.php?" + param, true);
request.onreadystatechange = comet_response;
request.send(null);
}
function comet_response() {
if (request.readyState === 4)
{
if (request.status === 200)
{
if (request.responseText !== null)
{
var text = request.responseText;
if (text === "end") document.getElementById('count1').innerHTML += "<br/>Task is executed";
else
{
var result = text.split(",");
q = result[result.length-1];
document.getElementById('count1').innerHTML += "<br/>" + request.responseText;
setTimeout(comet, 2000);
}
}
else document.getElementById('count1').innerHTML += "<br/>No response";
}
else document.getElementById('count1').innerHTML += "<br/>Invalid connection";
}
}
</script>
</head>
<body>
<div>
Click button to start counter: <input type="button" value="Начать" name="btnStart" id="btnStart" onclick="comet_btnStart()" /><br/><br/>
Counts:<br/> <span id='count1' style='color: #246499; font-weight: bold'></span>
</div>
</body>
PHP:
<?php
if (isset($_GET['btnStart']))
{
$q_msg = "";
$q = 0;
logic::counter();
echo $q_msg;
$q_msg = "";
}
if (isset($_GET['q']))
{
$lastq = $_GET['q'];
global $q;
if ($lastq < $q)
{
echo $q_msg;
$q_msg = "";
}
else echo "end";
}
class logic
{
static function counter()
{
global $q;
while ($q <= 10)
{
sleep(1);
$q++;
global $q_msg;
if (strlen($q_msg) > 0) $q_msg .= ", " . $q;
else $q_msg = $q;
//just for debugging
echo $q_msg; //why server doesn't send data???
}
}
}
