websocket实现聊天室简易demo

websocket实现聊天室简易demo

聊天室demo

（1）Client：客户端说明

客户端的代码主要是使用H5的WebSocket进行实现，在前端网页中使用WebSocket进行连接服务端，然后建立Socket连接进行通讯。

（2）Server：服务端说明

服务端主要是建立多个客户端的关系，进行消息的中转等。客户端成功连接到服务端之后，就可以通过建立的通道进行发送消息到服务端，服务端接收到消息之后在群发给所有的客户端。

（3）客户端和服务端连接

 var websocket = new WebSocket("ws://localhost:8080/websocket");

（4）客户端和服务端怎么发送消息？

客户端可以使用webSocket提供的send()方法，如下代码：

var message = document.getElementById('text').value;  
 websocket.send(message);

服务端怎么发送消息呢？主要是使用在成功建立连接的时候，创建的Session对象进行发送，如下代码：

 session.getAsyncRemote().sendText("恭喜您成功连接上WebSocket");

（5）客户端和服务端怎么接受消息？

客户端接收消息消息使用的是websocket的onmessage回调方法，如下代码： 

websocket.onmessage = function(event) {  
            //文本信息直接显示，如果是json信息，需要转换下在显示.  
        var data = event.data;  
        document.getElementById('message').innerHTML += data;  
 }

服务端：

@OnMessage  
 public void onMessage(String message, Session session) {  
         System.out.println("来自客户端的消息:" + message);  
 }

（6）群聊原理（群发消息）

服务端在和客户端建立连接的时候，会创建一个webSocket对象，我们会将每个连接创建的对象进行报错到一个列表中，比如：CopyOnWriteArraySet（这是线程安全的）；在要进行群发的时候，编写我们的列表对象进行群发消息。

（7）单聊原理（一对一消息）

聊的时候，就无需遍历列表，而是需要知道发送者和接受者各自的Session对象，这个Session对象怎么获取呢？Session可以获取到sessionId，发送者在发送消息的时候，携带接收消息的sessionId，那么问题就演变成了：发送者怎么知道接受者的sessionId，那就是加入一个在线用户列表即可，在线用户列表中有用户的基本信息，包括sessionId。

websocket的实时推送

对比聊天室的demo，不同之处在于，客户端连入服务器时候，会开启一个线程，在线程中对客户端进行推送数据。

关键代码：

/**
      * 接收到消息
      *
      * @param text
      */
     @OnMessage
     public void onMsg(Session session, String text) throws IOException {
         //记录客户端
         webSocketMaps.put(session, text);
         //实例化工作任务
         Operater operater =new Operater(session,text);
         //开启线程
         Thread thread = new Thread(operater);
         thread.start();
         logger.info("发送线程启动成功");
     }

目前业务还不是很复杂，后期功能添加时候，再进行扩展，关于这个实时推送，大概开了50个窗口就连接失败了。关于websocket的高并发，可以考虑。

以上就是一个简单websocket实现的聊天室demo。

在实际开发过程中，要实现高并发、高可用的websocket聊天室服务，并不是一件太简单的事。好在我们还有性能卓越的第三方的websocket服务框架可以选择。

对websocket服务有较高要求，选择成熟可靠的第三方websocket服务其实也是一个成本更低和高效的选择。GoEasy作为国内领先的第三方websocket消息平台，已经稳定运行了5年时间，支持千万级消息并发，除了兼容所有常见的浏览器以外，同时也兼容uni-app，各种小程序，以及vue、react-native等常见的前端框架。【立即体验】

文章参考： https://zhuanlan.zhihu.com/p/110620132

Comments are closed.