Ajax轮询定时的通过Ajax查询服务端
Ajax轮询定时的通过Ajax查询服务端
挨踢小子部落阁
发布于 2019-07-02 08:05:51
发布于 2019-07-02 08:05:51
代码可运行
运行总次数：0
代码可运行
轮询（polling）
客户端按规定时间定时向服务端发送ajax请求，服务器接到请求后马上返回响应信息并关闭连接。
ajax轮询的原理就是客户端定时向服务端发送ajax请求，服务器接到请求后马上返回响应信息并关闭连接，然后客户端继续发送ajax请求，一直持续这个循环。
var getting = {
url:'请求的服务器地址',
dataType:'json',
success:function(res) {
$('#com').html(str);
setTimeout(function(){$.ajax(getting);},1000);//1秒后定时发送请求
}
};
$.ajax(getting) 前端页面：
<!doctype html>
<html lang="zh-CN">
<head>
<title>这是一个测试</title>
</head>
<body>
<div id="info"></div>
</body>
<script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
var getting = {
url:'server.php',
dataType:'json',
success:function(res) {
console.log(res);
if(res.code=200){
$("#info").append(res.info+'</br>');
}else{
console.log(res);
}
}
};
//关键在这里，Ajax定时访问服务端，不断获取数据 ，这里是3秒请求一次。
window.setInterval(function(){$.ajax(getting)},3000);
</script>
</html> 后端PHP接口
$pdo = new PDO('mysql:dbname=test;host=127.0.0.1','root','Ltest');
$resource = $pdo->query('select * from z_test');
$result = $resource->fetchall();
if ($result) {
print_r(json_encode(array('code'=>'200','success'=>'获取数据成功','info'=>'这是测试')));
exit();
}
print_r(json_encode(array('code'=>'400','success'=>'获取数据失败','info'=>'')));
exit(); ajax轮询的方式实现比较简单，但是比较浪费服务器的资源，服务器大多时间处理的是无用的请求。
最近在关注HTML5的一个新的协议websocket，实现了浏览器与服务器的全双工通信，可以很好地节省服务器资源。他的原理是客户端向服务器发送请求后，如果服务器没有新数据就不做响应，等有新数据时，服务器就主动向客户端传递数据。
作者：json2008
原文：https://blog.csdn.net/fengqingtao2008/article/details/82146646
本文参与 腾讯云自媒体同步曝光计划，分享自微信公众号。
原始发表：2019-06-27，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
腾讯云开发者
