jquery與php結合實現AJAX長輪詢(LongPoll)
HTTP是無狀態(tài)、單向的協議,用戶只能夠通過客服端向服務器發(fā)送請求并由服務器處理發(fā)回一個響應。若要實現聊天室、WEBQQ、在線客服、郵箱等這些即時通訊的應用,就要用到“ 服務器推送技術(Comet)”。
傳統(tǒng)的AJAX輪詢方式,客服端以用戶定義的時間間隔去服務器上查詢最新的數據。種這種拉取數據的方式需要很短的時間間隔才能保證數據的精確度,但太短的時間間隔客服端會對服務器在短時間內發(fā)送出多個請求。
反轉AJAX,就是所謂的長輪詢或者COMET。服務器與客服端需要保持一條長時間的請求,它使得服務器在有數據時可以返回消息給客戶端。
XHTML
<div id="msg"></div> <input id="btn" type="button" value="測試" />
jQuery
這里使用AJAX請求data.php頁面獲得‘success'的值,請求的時間達到80秒。在這80秒中若沒有從服務端返回‘success'則一直保持連接狀態(tài),直到有數據返回或‘success'的值為0才關閉連接。在關閉連接后在繼續(xù)下一次的請求。
$(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){ //從服務器得到數據,顯示數據并繼續(xù)查詢 if(data.success=="1"){ $("#msg").append("<br>[有數據]"+data.text); evdata.data.btn.click(); } //未從服務器得到數據,繼續(xù)查詢 if(data.success=="0"){ $("#msg").append("<br>[無數據]"); evdata.data.btn.click(); } }, //Ajax請求超時,繼續(xù)查詢 error:function(XMLHttpRequest,textStatus,errorThrown){ if(textStatus=="timeout"){ $("#msg").append("<br>[超時]"); evdata.data.btn.click(); } } }); }); });
PHP
在這里是無限的循環(huán),循環(huán)的結束條件就是獲取到了返回結果返回Json數據。
并且接受$_POST['time']參數來限制循環(huán)的超時時間,避免資源的過度浪費。(瀏覽器關閉不會發(fā)消息給服務器,使用可能一直循環(huán)下去)
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的請求中若獲得數據則請求關閉。
相關文章
IIS7中Ajax.AjaxMethod無效的原因及解決方法
使用Ajax.AjaxMethod方法在asp.net的服務器下一切正常,用iis的時候,js中總是cs類找不到,具體的解決方法如下,遇到類似情況的朋友可以參考下2013-07-07Ajax遍歷jSon后對每一條數據進行相應的修改和刪除(代碼分享)
這篇文章主要介紹了Ajax遍歷jSon后對每一條數據進行相應的修改和刪除的相關資料,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-11-11