[译] 实时通讯：使用 Spring Boot 实现 WebSocket

keyholesoftware.com/2017/04/10/…
做者：THOMAS KENDALL
译者：oopsguy.com

在开发 Web 应用程序时，咱们有时须要将服务端事件推送到链接的客户端。但 HTTP 并不能作到。客户端打开与服务端的链接并请求数据，但服务端不能打开与客户端的链接并推送数据。

为了解决这个限制，咱们能够创建了一个轮询模式，网页会间隔地轮询服务器以获取新事件。但这种模式不太理想，由于它增长了 HTTP 开销，速度也只能达到与轮询的速率同样快，而且给服务器增长了没必要要的负载。

幸运的是，HTML5 WebSocket 出现了。WebSocket 协议容许浏览器与 Web 服务器之间进行低开销的交互。在文中，咱们将介绍 Websockets API，并展现如何使用 Spring Boot 实现 Websockets。

HTML5 来救场！

WebSockets 经过浏览器和服务器之间的单链接提供全双工通讯。它不存在 HTTP 开销，而且容许服务器将消息实时推送到客户端。

WebSocket API 实际上很简单。您只须要建立一个 WebSocket 对象，附加事件监听器和发送消息便可。

如下是一个例子：

var socket = new WebSocket('ws://' + window.location.host + '/my-websocket-endpoint');

// Add an event listener for when a connection is open
socket.onopen = function() {
  console.log('WebSocket connection opened. Ready to send messages.');

  // Send a message to the server
  socket.send('Hello, from WebSocket client!');
};

// Add an event listener for when a message is received from the server
socket.onmessage = function(message) {
  console.log('Message received from server: ' + message);
};复制代码

Spring Boot

Spring 对 WebSockets 接口提供了很好的支持。

首先，咱们须要建立一个类，继承 Spring 的 TextWebSocketHandler 类。

public class MyMessageHandler extends TextWebSocketHandler {

    @Override
    public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
        // The WebSocket has been closed
    }

    @Override
    public void afterConnectionEstablished(WebSocketSession session) throws Exception {
        // The WebSocket has been opened
        // I might save this session object so that I can send messages to it outside of this method

        // Let's send the first message
        session.sendMessage(new TextMessage("You are now connected to the server. This is the first message."));
    }

    @Override
    protected void handleTextMessage(WebSocketSession session, TextMessage textMessage) throws Exception {
        // A message has been received
        System.out.println("Message received: " + textMessage.getPayload());
    }
}复制代码

接下来，咱们须要配置 WebSocket 端点。

@Configuration
@EnableWebSocket
public class WebsocketConfig implements WebSocketConfigurer {

    @Bean
    public WebSocketHandler myMessageHandler() {
        return new MyMessageHandler();
    }

    @Override
    public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
        registry.addHandler(myMessageHandler(), "/my-websocket-endpoint");
    }

}复制代码

因为 WebSockets API 是纯 JavaScript，您能够在大多数前端框架中它。包括 Angular，您能够在 TypeScript 中包含 JavaScript 代码。

总结

是否是至关简单？它解决了服务端和客户端之间传输数据的一大困扰。Spring Boot 使它变得更加简单。