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);
 }
 ?>

---