web前端異步數據交互（長連接）

Workers異步任務

開始（注冊）：

divobjx=document.getElementsByTagName("div")[0];
var workdong=new Worker("dong.js");//創建work對象
workdong.onmessage=function(ee){
    var resx=ee.data;//得到數據
    divobjx.innerHTML=resx;//數據顯示
}

任務文件（dong.js）:

var conutx =0;
function confun(){
    postMessage(conutx);//發送消息
    conutx++;
    setTimeout(confun,1000);//遞歸調用
}
confun();

停止任務：

if(workdong){
    workdong.terminate();
    workdong=null;
}

獲取服務器實時數據

客戶端實現EventSource，定時訪問（一般在2-3秒頻率）服務器以刷新頁面，每次訪問會執行完服務器腳本的所有內容，服務器可以使用ob_flush();flush();進行一次訪問數據的多條分別輸出。

客戶端：

divobjx=document.getElementsByTagName("div")[0];
divobjx1=document.getElementsByTagName("div")[1];
//異步任務開始
var  ev=new EventSource("dong.php");
ev.onopen=function(e){
    divobjx1.innerHTML="鏈接打開中";
}

//獲取數據方法一
//ev.onmessage=function(e){
//    var resx=e.data;//得到數據
//    divobjx.innerHTML=resx;//數據顯示
//}

//獲取數據方法二
ev.addEventListener("newdong",function(e){
    divobjx.innerHTML=e.data;
});
ev.onerror=function(e){
    divobjx1.innerHTML="鏈接錯誤或當次執行完畢";
}

服務器：

<?php
header('Content-Type: text/event-stream');
for($i=0;$i<5;$i++){
    //事件名，如果使用方法一進行數據獲取，則必須省略此句
    echo "event:newdong\n";
    //數據
    echo "data:dongxioadong東東".$i."\n\n";
    //刷新，實現逐條發送
    ob_flush();
    flush();
    sleep(1);
}
?>

---