傳統的AJAX輪詢方式,客服端以使用者定義的時間間隔去伺服器上查詢最新的資料。種這種拉取資料的方式需要很短的時間間隔才能保證資料的精確度,但太短的時間間隔客服端會對伺服器在短時間內發送出多個請求。
反轉AJAX,就是所謂的長輪詢或者COMET。伺服器與客服端需要保持一條長時間的請求,它使得伺服器在有資料時可以返回訊息給用戶端。
XHTML
- <div id="msg">div>
- <input id="btn" type="button" value="測試" />
jQuery
這裡使用AJAX請求data.php頁面獲得‘success’的值,請求的時間達到80秒。在這80秒中若沒有從服務端返回‘success’則一直保持串連狀態,直到有資料返回或‘success’的值為0才關閉串連。在關閉串連後在繼續下一次的請求。
- $(function(){
- $("#btn").bind("click",{btn:$("#btn")},function(evdata){
- $.ajax({
- type:"POST",
- dataType:"json",
- url:"data.php",
- timeout:80000, //ajax請求逾時時間80秒
- data:{time:"80"}, //40秒後無論結果伺服器都返回資料
- success:function(data,textStatus){
- //從伺服器得到資料,顯示資料並繼續查詢
- if(data.success=="1"){
- $("#msg").append("
[有資料]"+data.text);
- evdata.data.btn.click();
- }
- //未從伺服器得到資料,繼續查詢
- if(data.success=="0"){
- $("#msg").append("
[無資料]");
- evdata.data.btn.click();
- }
- },
- //Ajax請求逾時,繼續查詢
- error:function(XMLHttpRequest,textStatus,errorThrown){
- if(textStatus=="timeout"){
- $("#msg").append("
[逾時]");
- evdata.data.btn.click();
- }
- }
-
- });
- });
-
- });
PHP
在這裡是無限的迴圈,迴圈的結束條件就是擷取到了返回結果返回Json資料。
並且接受$_POST['time']參數來限制迴圈的逾時時間,避免資源的過度浪費。(瀏覽器關閉不會發訊息給伺服器,使用可能一直迴圈下去)
- if(emptyempty($_POST['time']))exit();
- set_time_limit(0);//無限請求逾時時間
- $i=0;
- while (true){
- //sleep(1);
- usleep(500000);//0.5秒
- $i++;
-
- //若得到資料則馬上返回資料給客服端,並結束本次請求
- $rand=rand(1,999);
- if($rand<=15){
- $arr=array('success'=>"1",'name'=>'xiaocai','text'=>$rand);
- echo json_encode($arr);
- exit();
- }
-
- //伺服器($_POST['time']*0.5)秒後告訴客服端無資料
- if($i==$_POST['time']){
- $arr=array('success'=>"0",'name'=>'xiaocai','text'=>$rand);
- echo json_encode($arr);
- exit();
- }
- }
運行效果:在圖中可以看到無資料的請求時間達到了40S,在40S的請求中若獲得資料則請求關閉。
http://www.bkjia.com/PHPjc/445814.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/445814.htmlTechArticle傳統的AJAX輪詢方式,客服端以使用者定義的時間間隔去伺服器上查詢最新的資料。種這種拉取資料的方式需要很短的時間間隔才能保證資料的...