利用comet技术实现web聊天

其实comet技术说起来也蛮简单的,就是客户端连接到服务器之后,服务器并不是立刻返回结果,而是一直保持连接,等到服务器有结果时再返回,这样,比平常的轮询技术节约了带宽,减轻了服务器的压力,这样其实把轮询放到了服务器上而已,然后就写了个群聊的东东在这里。http://group.isnowfy.com/ 

这样客户端可以利用ajax技术建立长连接,当连接断掉立即重连就可以了。

  1. function chat(timestamp) {
  2.  $.ajax({
  3.     type: "GET",
  4.     data: "time="+timestamp,
  5.     dataType: "json",
  6.     url: "protected/backend.php",
  7.     success: function(msg){
  8.    chat(msg.timestamp);
  9.    var timestamp=msg.timestamp;
  10.    $('#content').append('<div>' + msg.msg + '</div>');
  11.     },
  12.     error: function(msg){
  13.    chat(timestamp);
  14.     }
  15.  });
  16. }

服务器受到数据后可以轮询看数据是否有变化然后进行返回即可。

然后写完会发现有个问题,在我的chrome浏览器上会发现那个圈圈一直在转,也就是说相当于是网页一直没有完成,在等待服务器的数据,这样看上去会非常的不爽。解决办法就是当window的load事件结束之后再开始建立长连接。

  1. <script>
  2. window.onload=setTimeout(function(){chat(0);},20);
  3. </script>

像这样就可以了。然后还有就是发现mysql里的记录时间的类型最多也就是到秒,比如date,datetime,timestamp,我是用数据库来记录的,这样秒级的显然不行,如果多人或者什么的就会有问题,然后采用php中的microtime()函数获取时间戳,然后把它存成浮点类型就可以了。然后存数据库的时候注意把一些特殊符号如&/\<>之类的转义,这样就不会有sql注入的问题了,大概就做了这点东西吧,等什么时候加个群聊附带涂鸦板的就有趣了啊。

您可能喜欢:
我猜您可能还喜欢:
, ,

《利用comet技术实现web聊天》有 26 条评论

  1. map4567 | #2

    找不到人呀,得在QQ上问出房间号呀,呀呀呀。。。。

  2. hxc | #4

    服务器轮询是如何搞的撒?

    • isnowfy

      @hxc: 就是服务器跑个死循环这样子,加个sleep,每隔多少时间去查看一下是否有更新,我是放在数据库里的,所以就是记录上次取得的最老时间,每次取出所有的比上次时间新的数据

  3. 想了下突然有个疑问,比如很多个前端都建立了一个长链接,其中一个发送请求修改了服务器的那个文件,那么后端就需要返回,这个时候返回给每个前端的值是同一个吗?

    也就是说每个前端都会让后端新起一个php进程对吧,那么其中一个进程改动那个文件后其余进程感知到这个改变是同时发生的?不会出现进程1先把那个改变给接受而其他进程检测不到这种情况吗?

    类似的如果有很多很多个前端,后端的并发限制应该很严格吧?

  4. 额。。。我理解错了。。。你是把数据都持久化到数据库了就不存在我说的这个问题了。。 __;

  5. enjoylearning | #7

    可以考虑用sinnalR

  6. Facebook 有一个开源的long polling python库, tornado, 可以参考一下

  7. mrbell | #9

    php新人,学习comet,求教backend.php代码片段

  8. 为什么我发送消息只是插入数据,很长时间才能插入,需要几十秒。代码都是用你的改造的。

Trackbacks/Pingbacks:

  1. Definite Digest » 理解OAuth
  2. Thought this was cool: P和NP那些事 « CWYAlpha
  3. Thought this was cool: 字符编码和中文乱码小叙 « CWYAlpha
  4. python实现websocket服务器 | 吃杂烩
  5. Thought this was cool: python实现websocket服务器 « CWYAlpha

发表评论