ajax輪詢與長輪詢


    剛剛網了關於輪詢的知識,必須拿到自己這里來做個備份了!

  其實以前用ajax輪詢做個及時數據更新的,只是當時做了不知道那個就是輪詢。

    首先我們什么時候會想到用輪詢技術呢?

      一般而言,最多的是及時信息更新,比如一個商城活動,參與人數的實時更新等,也還有人用來做過聊天室的,但是哈,輪詢技術問題還是很多的,頻繁的請求的服務器,服務器會把IP給你列入非白名單里,讓你無法請求服務器。所以做及時的我還是建議用websocket 建立長連接。

    其次小楊用一位老師的原話來講解一下ajax輪詢技術:

        一、Ajax輪詢——“定時的通過Ajax查詢服務端”

  

          Ajax輪詢——"定時的通過Ajax查詢服務端"。

          概念:

            輪詢(polling):客戶端按規定時間定時像服務端發送ajax請求,服務器接到請求后馬上返回響應信息並關閉連接。

            百聞不如一見,來段代碼相信你一看就明白

            //為了讓同學們都明白,我用了最簡單的實現方法,同學們懂了原理后可以自行衍生:

            Reception.html //前端代碼

<html>

<head>

    <title></title>

    <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>

</head>

<body>

</body>

<script type="text/javascript">

        var getting = {

        url:'server.php',

        dataType:'json',

        success:function(res) {

         console.log(res);

}

};

//關鍵在這里,Ajax定時訪問服務端,不斷獲取數據 ,這里是1秒請求一次。

window.setInterval(function(){$.ajax(getting)},1000);

</script>

</html>

      //服務端。

      server_polling.php

<?php

$pdo = new PDO('mysql:dbname=test;host=127.0.0.1','root','root');

$resource = $pdo->query('select * from t1');

$result = $resource->fetchall();

if ($result) {

    //exits data

    print_r(json_encode(array('success'=>'存在數據')));

    exit();

}

print_r(json_encode(array('failed'=>'不存在數據')));

exit();

?>

        上面就是最基本最簡化的Ajax輪詢。判斷t1表是否有數據,並執行對應輸出。 實際項目中的話查詢語句就根據實際需求來定就可以了。

        Ajax輪詢最關鍵的地方在於"window.setInterval(function(){$.ajax(getting)},1000);" ,也就是文章開頭所說的"客戶端按規定時間定時像服務端發送ajax請求"。

        我們用圖解釋一下吧:

          從圖中我們可以看出,客戶端是按照規定時間(這個時間由你設定,此處默認為1秒)像服務端發送請求,前一次請求完成后,無論有無結果返回,一秒之后下一次請求又會發出。這就叫做Ajax輪詢。

        用偽代碼來表示一下:

<?php

//Ajax輪詢

while(true){

    echo'發送一次請求';

    sleep(1) ; //這次請求發送完畢了,休息一秒鍾之后繼續發起請求

}

?>

        最關鍵的地方在於,客戶端需要通過JS設定一個定時器,按照規定時間不斷的請求。

        容易吧,其實真就沒那么難,很多時候,僅僅是我們自己被新技術嚇到罷了

        嗯那么我們接下來看看Ajax 長輪詢算是Ajax輪詢的升級版

    二、Ajax長輪詢(long polling)

      Ajax長輪詢屬於Ajax輪詢的升級版,在客戶端和服務端都進行了一些改造,使得消耗更低,速度更快。

      "不間斷的通過Ajax查詢服務端"。

      Reception.html //客戶端

<html>

<head>

    <title></title>

    <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>

</head>

<body>

</body>

<script type="text/javascript">

    //前端Ajax持續調用服務端,稱為Ajax輪詢技術

    var getting = {

        url:'server.php',

        dataType:'json',

        success:function(res) {

         console.log(res);

         $.ajax(getting); //關鍵在這里,回調函數內再次請求Ajax

}        
        //當請求時間過長(默認為60秒),就再次調用ajax長輪詢
        error:function(res){
        $.ajax($getting);
        }

};

$.ajax(getting);

</script>

</html>

      server.php: //服務端

<?php
//這段AJAX請求時間永不過期
set_time_limit(0);

$pdo = new PDO('mysql:dbname=test;host=127.0.0.1','root','root');

$resource = $pdo->query('select * from t1');

$result = $resource->fetchall();

while (true) {

    if ($result) {

        //exits data

        print_r(json_encode(array('success'=>'存在數據,返回')));

        exit(); //輸出數據,退出。然后客戶端不間斷繼續發起請求

    }

    //數據不存在,繼續循環。

}

?>

        長輪詢的精髓就在於Ajax的回調函數,繼續再次調用Ajax請求(不間斷的原理就在這里,成功返回后立即再次調用):

$.ajax(getting);

下面是是Ajax 長輪詢的圖解:

圖中有兩次請求(本文中的請求默認均為Ajax),第一次很快返回了結果,然后不間斷的立即發送第二次請求,但是第二次請求沒有獲得數據,所以請求遲遲沒有返回(被掛在服務器了,但只要有數據就會再次返回),如果第二次的請求返回數據后,第三次請求旋即會立刻發出,這種技術就稱為Ajax 長輪詢。

用偽代碼來表示就是這樣:

<?php

//客戶端通過Ajax發起請求

if ('客戶端發送請求' && '服務端有數據可以返回') {

    echo '返回數據給客戶端';

    echo '客戶端通過Ajax繼續發起請求,然后繼續if判斷';

}else{

    echo'沒有數據可以返回,再次執行一次if判斷';

}

?>

最關鍵的地方在於前一次請求結束后,第二次請求立即不間斷的發起,這個就叫做Ajax長輪詢


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM