jquery與php結(jié)合實(shí)現(xiàn)AJAX長(zhǎng)輪詢(LongPoll)
HTTP是無狀態(tài)、單向的協(xié)議,用戶只能夠通過客服端向服務(wù)器發(fā)送請(qǐng)求并由服務(wù)器處理發(fā)回一個(gè)響應(yīng)。若要實(shí)現(xiàn)聊天室、WEBQQ、在線客服、郵箱等這些即時(shí)通訊的應(yīng)用,就要用到“ 服務(wù)器推送技術(shù)(Comet)”。
傳統(tǒng)的AJAX輪詢方式,客服端以用戶定義的時(shí)間間隔去服務(wù)器上查詢最新的數(shù)據(jù)。種這種拉取數(shù)據(jù)的方式需要很短的時(shí)間間隔才能保證數(shù)據(jù)的精確度,但太短的時(shí)間間隔客服端會(huì)對(duì)服務(wù)器在短時(shí)間內(nèi)發(fā)送出多個(gè)請(qǐng)求。
反轉(zhuǎn)AJAX,就是所謂的長(zhǎng)輪詢或者COMET。服務(wù)器與客服端需要保持一條長(zhǎng)時(shí)間的請(qǐng)求,它使得服務(wù)器在有數(shù)據(jù)時(shí)可以返回消息給客戶端。
XHTML
<div id="msg"></div> <input id="btn" type="button" value="測(cè)試" />
jQuery
這里使用AJAX請(qǐng)求data.php頁面獲得‘success'的值,請(qǐng)求的時(shí)間達(dá)到80秒。在這80秒中若沒有從服務(wù)端返回‘success'則一直保持連接狀態(tài),直到有數(shù)據(jù)返回或‘success'的值為0才關(guān)閉連接。在關(guān)閉連接后在繼續(xù)下一次的請(qǐng)求。
$(function(){ $("#btn").bind("click",{btn:$("#btn")},function(evdata){ $.ajax({ type:"POST", dataType:"json", url:"data.php", timeout:80000, //ajax請(qǐng)求超時(shí)時(shí)間80秒 data:{time:"80"}, //40秒后無論結(jié)果服務(wù)器都返回?cái)?shù)據(jù) success:function(data,textStatus){ //從服務(wù)器得到數(shù)據(jù),顯示數(shù)據(jù)并繼續(xù)查詢 if(data.success=="1"){ $("#msg").append("<br>[有數(shù)據(jù)]"+data.text); evdata.data.btn.click(); } //未從服務(wù)器得到數(shù)據(jù),繼續(xù)查詢 if(data.success=="0"){ $("#msg").append("<br>[無數(shù)據(jù)]"); evdata.data.btn.click(); } }, //Ajax請(qǐng)求超時(shí),繼續(xù)查詢 error:function(XMLHttpRequest,textStatus,errorThrown){ if(textStatus=="timeout"){ $("#msg").append("<br>[超時(shí)]"); evdata.data.btn.click(); } } }); }); });
PHP
在這里是無限的循環(huán),循環(huán)的結(jié)束條件就是獲取到了返回結(jié)果返回Json數(shù)據(jù)。
并且接受$_POST['time']參數(shù)來限制循環(huán)的超時(shí)時(shí)間,避免資源的過度浪費(fèi)。(瀏覽器關(guān)閉不會(huì)發(fā)消息給服務(wù)器,使用可能一直循環(huán)下去)
if(emptyempty($_POST['time']))exit(); set_time_limit(0);//無限請(qǐng)求超時(shí)時(shí)間 $i=0; while (true){ //sleep(1); usleep(500000);//0.5秒 $i++; //若得到數(shù)據(jù)則馬上返回?cái)?shù)據(jù)給客服端,并結(jié)束本次請(qǐng)求 $rand=rand(1,999); if($rand<=15){ $arr=array('success'=>"1",'name'=>'xiaocai','text'=>$rand); echo json_encode($arr); exit(); } //服務(wù)器($_POST['time']*0.5)秒后告訴客服端無數(shù)據(jù) if($i==$_POST['time']){ $arr=array('success'=>"0",'name'=>'xiaocai','text'=>$rand); echo json_encode($arr); exit(); } }
運(yùn)行效果:在圖中可以看到無數(shù)據(jù)的請(qǐng)求時(shí)間達(dá)到了40S,在40S的請(qǐng)求中若獲得數(shù)據(jù)則請(qǐng)求關(guān)閉。
相關(guān)文章
Ajax刪除數(shù)據(jù)與查看數(shù)據(jù)操作
這篇文章主要介紹了Ajax刪除數(shù)據(jù)與查看數(shù)據(jù)操作,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-03-03IIS7中Ajax.AjaxMethod無效的原因及解決方法
使用Ajax.AjaxMethod方法在asp.net的服務(wù)器下一切正常,用iis的時(shí)候,js中總是cs類找不到,具體的解決方法如下,遇到類似情況的朋友可以參考下2013-07-07Ajax方式實(shí)現(xiàn)定期更新頁面某塊內(nèi)容的方法
這篇文章主要介紹了Ajax方式實(shí)現(xiàn)定期更新頁面某塊內(nèi)容的方法,涉及jquery中l(wèi)oad方法Ajax調(diào)用及setInterval定時(shí)執(zhí)行的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07ztree+ajax實(shí)現(xiàn)文件樹下載功能
這篇文章主要為大家詳細(xì)介紹了ztree+ajax實(shí)現(xiàn)文件樹下載功能,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-05-05react axios 跨域訪問一個(gè)或多個(gè)域名問題
這篇文章主要介紹了react axios 跨域訪問一個(gè)或多個(gè)域名問題,本文通過實(shí)例代碼截圖的形式給大家展示的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-04-04Ajax遍歷jSon后對(duì)每一條數(shù)據(jù)進(jìn)行相應(yīng)的修改和刪除(代碼分享)
這篇文章主要介紹了Ajax遍歷jSon后對(duì)每一條數(shù)據(jù)進(jìn)行相應(yīng)的修改和刪除的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-11-11