用大白話揭開Ajax長輪詢(long polling)的神祕面紗

時間 2019-11-06

標籤大白話揭開 ajax 輪詢 long polling 神祕面紗欄目 Ajax 简体版

原文原文鏈接

在看這篇Ajax長輪詢以前能夠先看看Ajax輪詢技術（沒有長），有助於理解：javascript

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

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

來，小二，先上代碼~：前端

Reception.html //客戶端java

<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: //服務端mysql

<?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請求（不間斷的原理就在這裏，成功返回後當即再次調用）：jquery

$.ajax(getting);ajax

下面是是Ajax 長輪詢的圖解：
sql

首先請忽略綠色字體的使用限制，而後哪位朋友有能夠推薦的畫圖工具能夠推薦給我，我如今用的是憶圖圖示。json

圖中有兩次請求（本文中的請求默認均爲Ajax），第一次很快返回告終果，而後不間斷的當即發送第二次請求，可是第二次請求沒有得到數據，因此請求遲遲沒有返回（被掛在服務器了，但只要有數據就會再次返回），若是第二次的請求返回數據後，第三次請求旋即會馬上發出，這種技術就稱爲Ajax 長輪詢。

用僞代碼來表示就是這樣：

<?php

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

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

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

    echo '客戶端經過Ajax繼續發起請求，而後繼續if判斷';

}else{

    echo'沒有數據能夠返回，再次執行一次if判斷';

}

?>

最關鍵的地方在於前一次請求結束後，第二次請求當即不間斷的發起，這個就叫作Ajax長輪詢