在web开发中有时会用到消息提醒,一般都是使用浏览器前端轮询消息接口来获得最新消息提醒,或者使用socket的方式获取消息(这种方式带给服务器的压力小)。本文只介绍使用ajax轮询获取消息的方式。
前端页面index.html
<!DOCTYPE HTML><html><head><title>ajax获取消息</title><meta charset="UTF-8"><style>.send{color:#555;text-align: left;}.require{color:blue;text-align: right;}.content_box{text-align: center;margin: 20px;border: 1px solid #ddd;padding: 20px;}</style><script src="http://code.jQuery.com/jquery-1.11.2.min.js"></script></head><div class="content_box" id="content_box"><script type="text/javascript">connect();//建立通讯连接函数function connect(){$('#content_box_title').html($('#username').val()+'的消息窗口');$.ajax({data:{'user':$('#username').val()},url:'ajaxPush.PHP',type:'get',timeout:0,dataType:'json',success:function(data){$('#content_box').append('<div class="require">服务器返回消息:'+data.msg+'</div>');// connect();}});}//Ajax定时访问服务端,这里是10000ms请求一次。window.setInterval(function(){// $.ajax(getting)connect();},10000);//180000毫秒</script>
简易版后台消息接口ajaxPush.php
<?phpecho json_encode(array('msg'=>time().' ==服务器返回'));
直接访问index.html即可,只要网页不关闭会一直请求消息,建议轮询间隔至少保证1分钟。如果想要实时性好还是使用socket或其他第三方消息通知接口。在现实中ajaxPush.php显然是完全不可使用的,还需要增加数据存储与相关的逻辑处理,公告类型消息与单用户消息的处理一般也有所不同(尤其用户量很大且需要标记已读未读的情况)。
发表评论