websocket通俗易懂的聊天室逻辑

介绍

websocket 是一种网络通信协议，传统的HTTP协议的缺陷之处类似于我问你答，或者他问你答这种情况，你是不能主动表达什么或回答什么的。

举个例子，一个聊天群，如果每个用户都能实时接收到消息，使用传统的http协议就需要每个用户隔一段时间向服务器发送一次请求，去查询有没有新的消息，但是这种轮询的方式非常耗费资源。所以websocket协议就出现了。
websocket服务端可以主动向客户端推送信息，客户端也可以主动向服务端发送信息，是一种全双工通讯的网络技术。
之前已经简单搭建过websocket的服务，用websocket可以实现一个聊天室的逻辑

前端代码如下

Nodejs后端代码

• 实现多人聊天室的效果需要维护一个简单的计数器

  
  

• 创建websocket服务

• 打开浏览器访问，可以看到页面

  
  

• 不关闭当前页面，复制地址栏内容，打开一个新的网页

  
  

现在的这种逻辑有缺陷，就是当前页面更新了，之前的页面却没有显示 用户2进入聊天室，这里需要用到websocket的connections属性，这个属性访问的是所有建立连接的客户端

• 在外部定义一个函数

  
  

• 调用函数，函数内部通过forEach来遍历，给每个客户端发送数据

  
  
  

  三个页面效果如下

  
  
  
  
• 可以看到每次有用户进入页面，另外两个页面也显示了自己和他人的进入信息

同样的，当我们点击按钮发送数据的时候也调用此函数，就可以实现实时消息的效果了

• 输入内容点击发送，依次打开三个页面看到效果如下，不同页面间可以接收到其他人发送的数据

  
  

一个聊天室的简单实现！