Ajax 轮询（定时的通过 Ajax 查询服务端）案例

转载专用

4年前发布

219590

什么是轮询？

Ajax 轮询（定时的通过 Ajax 查询服务端）案例

概念：轮询（polling）：客户端按规定时间定时向服务端发送 ajax 请求，服务器接到请求后马上返回响应信息并关闭连接。

Ajax 轮询代码案例：

1、test.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>

2、server.php //服务端代码

<?php
$pdo = new PDO('mysql:dbname=test;host=127.0.0.1','root','root');
$resource = $pdo->query('select * from table');
$result = $resource->fetchall();
if ($result) {
//exits data
    print_r(json_encode(array('success'=>'存在数据')));
exit();
}
print_r(json_encode(array('failed'=>'不存在数据')));
exit();

上面就是最基本最简化的 Ajax 轮询。判断 table 表是否有数据，并执行对应输出。实际项目中的话查询语句就根据实际需求来定就可以了。

Ajax 轮询最关键的地方在于：

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

也就是文章开头所说的”客户端按规定时间定时像服务端发送 ajax 请求”。

Ajax 轮询原理：

客户端是按照规定时间（这个时间由你设定，此处默认为 1 秒）像服务端发送请求，前一次请求完成后，无论有无结果返回，一秒之后下一次请求又会发出。这就叫做 Ajax 轮询。

用伪代码来表示一下：

<?php
//Ajax 轮询
while(true){
echo'发送一次请求';
    sleep(1) ; //这次请求发送完毕了，休息一秒钟之后继续发起请求
}

最关键的地方在于，客户端需要通过 JS 设定一个定时器，按照规定时间不断的请求。

来源：付杰博客

文章版权归作者所有，未经允许请勿转载。

THE END

网络技术
# JavaScript # AJAX

打赏一根烟，继续保持。

相关推荐

评论共2条

友好交流，请勿发纯表情，请勿灌水，违者封号喔

提交

只看作者

- Peter317070
  AJAX做轮询稳定性不太好，并且CPU占用率高，建议使用websocket。
  4年前回复 IPV4：中国湖南长沙市电信-
- - 何先生0
    是的，AJAX轮询比较消耗流量，不适合常链接，不过相对简单，在处理某些简单的事情的时候好用点，比如我最近制作的扫描微信公众号登录博客，用AJAX轮询监听是否扫码返回数据然后返回数据。websocket来实现的话就比较麻烦了。 websocket比较适合聊天应用等复杂场景。
    4年前@Peter31707回复 cloudflare-