使用WebSocket

WebSocket是一种基于HTTP的长链接技术。传统的HTTP协议是一种请求-响应模型，如果浏览器不发送请求，那么服务器无法主动给浏览器推送数据。如果需要定期给浏览器推送数据，例如股票行情，或者不定期给浏览器推送数据，例如在线聊天，基于HTTP协议实现这类需求，只能依靠浏览器的JavaScript定时轮询，效率很低且实时性不高。

因为HTTP本身是基于TCP连接的，所以，WebSocket在HTTP协议的基础上做了一个简单的升级，即建立TCP连接后，浏览器发送请求时，附带几个头：

  1. GET /chat HTTP/1.1
  2. Host: www.example.com
  3. Upgrade: websocket
  4. Connection: Upgrade

就表示客户端希望升级连接，变成长连接的WebSocket，服务器返回升级成功的响应：

  1. HTTP/1.1 101 Switching Protocols
  2. Upgrade: websocket
  3. Connection: Upgrade

收到成功响应后表示WebSocket“握手”成功，这样，代表WebSocket的这个TCP连接将不会被服务器关闭，而是一直保持，服务器可随时向浏览器推送消息，浏览器也可随时向服务器推送消息。双方推送的消息既可以是文本消息，也可以是二进制消息，一般来说，绝大部分应用程序会推送基于JSON的文本消息。

现代浏览器都已经支持WebSocket协议，服务器则需要底层框架支持。Java的Servlet规范从3.1开始支持WebSocket，所以，必须选择支持Servlet 3.1或更高规范的Servlet容器，才能支持WebSocket。最新版本的Tomcat、Jetty等开源服务器均支持WebSocket。

我们以实际代码演示如何在Spring MVC中实现对WebSocket的支持。首先，我们需要在pom.xml中加入以下依赖：

  • org.apache.tomcat.embed:tomcat-embed-websocket:10.1.1
  • org.springframework:spring-websocket:6.0.0

第一项是嵌入式Tomcat支持WebSocket的组件，第二项是Spring封装的支持WebSocket的接口。

接下来，我们需要在AppConfig中加入Spring Web对WebSocket的配置，此处我们需要创建一个WebSocketConfigurer实例：

  1. @Bean
  2. WebSocketConfigurer createWebSocketConfigurer(
  3.         @Autowired ChatHandler chatHandler,
  4.         @Autowired ChatHandshakeInterceptor chatInterceptor)
  5. {
  6.     return new WebSocketConfigurer() {
  7.         public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
  8.             // 把URL与指定的WebSocketHandler关联，可关联多个:
  9.             registry.addHandler(chatHandler, "/chat").addInterceptors(chatInterceptor);
  10.         }
  11.     };
  12. }

此实例在内部通过WebSocketHandlerRegistry注册能处理WebSocket的WebSocketHandler，以及可选的WebSocket拦截器HandshakeInterceptor。我们注入的这两个类都是自己编写的业务逻辑，后面我们详细讨论如何编写它们，这里只需关注浏览器连接到WebSocket的URL是/chat。

处理WebSocket连接

和处理普通HTTP请求不同，没法用一个方法处理一个URL。Spring提供了TextWebSocketHandler和BinaryWebSocketHandler分别处理文本消息和二进制消息，这里我们选择文本消息作为聊天室的协议，因此，ChatHandler需要继承自TextWebSocketHandler：

  1. @Component
  2. public class ChatHandler extends TextWebSocketHandler {
  3.     ...
  4. }

当浏览器请求一个WebSocket连接后，如果成功建立连接，Spring会自动调用afterConnectionEstablished()方法，任何原因导致WebSocket连接中断时，Spring会自动调用afterConnectionClosed方法，因此，覆写这两个方法即可处理连接成功和结束后的业务逻辑：

  1. @Component
  2. public class ChatHandler extends TextWebSocketHandler {
  3.     // 保存所有Client的WebSocket会话实例:
  4.     private Map<String, WebSocketSession> clients = new ConcurrentHashMap<>();
  6.     @Override
  7.     public void afterConnectionEstablished(WebSocketSession session) throws Exception {
  8.         // 新会话根据ID放入Map:
  9.         clients.put(session.getId(), session);
  10.         session.getAttributes().put("name", "Guest1");
  11.     }
  13.     @Override
  14.     public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
  15.         clients.remove(session.getId());
  16.     }
  17. }

每个WebSocket会话以WebSocketSession表示，且已分配唯一ID。和WebSocket相关的数据，例如用户名称等，均可放入关联的getAttributes()中。

用实例变量clients持有当前所有的WebSocketSession是为了广播，即向所有用户推送同一消息时，可以这么写：

  1. String json = ...
  2. TextMessage message = new TextMessage(json);
  3. for (String id : clients.keySet()) {
  4.     WebSocketSession session = clients.get(id);
  5.     session.sendMessage(message);
  6. }

我们发送的消息是序列化后的JSON，可以用ChatMessage表示：

  1. public class ChatMessage {
  2.     public long timestamp;
  3.     public String name;
  4.     public String text;
  5. }

每收到一个用户的消息后，我们就需要广播给所有用户：

  1. @Component
  2. public class ChatHandler extends TextWebSocketHandler {
  3.     ...
  4.     @Override
  5.     protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
  6.         String s = message.getPayload();
  7.         String r = ... // 根据输入消息构造待发送消息
  8.         broadcastMessage(r); // 推送给所有用户
  9.     }
  10. }

如果要推送给指定的几个用户，那就需要在clients中根据条件查找出某些WebSocketSession，然后发送消息。

注意到我们在注册WebSocket时还传入了一个ChatHandshakeInterceptor，这个类实际上可以从HttpSessionHandshakeInterceptor继承，它的主要作用是在WebSocket建立连接后，把HttpSession的一些属性复制到WebSocketSession，例如，用户的登录信息等：

  1. @Component
  2. public class ChatHandshakeInterceptor extends HttpSessionHandshakeInterceptor {
  3.     public ChatHandshakeInterceptor() {
  4.         // 指定从HttpSession复制属性到WebSocketSession:
  5.         super(List.of(UserController.KEY_USER));
  6.     }
  7. }

这样，在ChatHandler中，可以从WebSocketSession.getAttributes()中获取到复制过来的属性。

客户端开发

在完成了服务器端的开发后，我们还需要在页面编写一点JavaScript逻辑：

  1. // 创建WebSocket连接:
  2. var ws = new WebSocket('ws://' + location.host + '/chat');
  3. // 连接成功时:
  4. ws.addEventListener('open', function (event) {
  5.     console.log('websocket connected.');
  6. });
  7. // 收到消息时:
  8. ws.addEventListener('message', function (event) {
  9.     console.log('message: ' + event.data);
  10.     var msgs = JSON.parse(event.data);
  11.     // TODO:
  12. });
  13. // 连接关闭时:
  14. ws.addEventListener('close', function () {
  15.     console.log('websocket closed.');
  16. });
  17. // 绑定到全局变量:
  18. window.chatWs = ws;

用户可以在连接成功后任何时候给服务器发送消息：

  1. var inputText = 'Hello, WebSocket.';
  2. window.chatWs.send(JSON.stringify({text: inputText}));

最后，连调浏览器和服务器端，如果一切无误，可以开多个不同的浏览器测试WebSocket的推送和广播：

chat

和上一节我们介绍的异步处理类似，Servlet的线程模型并不适合大规模的长链接。基于NIO的Netty等框架更适合处理WebSocket长链接，我们将在后面介绍。

练习

从使用WebSocket - 图2下载练习：使用WebSocket编写一个聊天室 （推荐使用IDE练习插件快速下载）

小结

在Servlet中使用WebSocket需要3.1及以上版本；

通过spring-websocket可以简化WebSocket的开发。

读后有收获可以支付宝请作者喝咖啡：

使用WebSocket - 图3