编程开源技术交流,分享技术与知识

网站首页 > 开源技术 正文

Spring Boot3 竟能如此轻松整合 WebSocket 技术,你还不知道?

wxchong 2025-03-30 22:06:36 开源技术 12 ℃ 0 评论

在当今互联网大厂的软件开发领域,实时通信的需求愈发迫切。无论是在线聊天应用、实时数据更新,还是协同办公系统,都离不开高效的实时通信技术支持。而 WebSocket 作为一种能够实现浏览器与服务器之间持久连接、双向实时传输数据的网络通信协议,正逐渐成为众多开发场景中的首选。

对于我们互联网大厂的技术开发人员而言,如何在 Spring Boot3 中高效整合 WebSocket 技术,无疑是一项关键技能。今天,就带大家深入探究这一技术融合的奥秘。

WebSocket 技术背景

WebSocket 是一种位于 OSI 模型应用层的网络传输协议,它基于 TCP 协议,提供全双工通信通道 。与传统的 HTTP 请求 - 响应模式相比,WebSocket 有着显著的优势。早期,许多网站为实现推送技术,采用轮询方式,即浏览器每隔一段时间(如每秒)向服务器发出 HTTP 请求,服务器返回最新数据给客户端。这种模式缺点明显,浏览器频繁请求,HTTP 请求与回复头部较长,真正有效的数据占比小,大量消耗带宽资源。后来出现的 Comet 技术虽能实现双向通信,但仍需反复请求,且 HTTP 长连接会消耗服务器资源 。在这样的背景下,HTML5 定义了 WebSocket 协议,它能节省服务器资源和带宽,更实时地进行通讯。

WebSocket 协议具有诸多优点,如控制开销少,在连接建立后,服务器和客户端交换数据时,协议控制数据包头部相对较小;实时性强,可实现服务器主动向客户端推送数据;保持连接状态,建立连接后成为有状态协议,后续通信可省略部分状态信息;对二进制支持好,定义了二进制帧便于处理二进制内容;支持扩展,用户可扩展协议、实现自定义子协议;压缩效果好,在适当扩展支持下,传递类似数据时能显著提高压缩率 。

在 Spring Boot3 中整合 WebSocket 的具体步骤

添加依赖

在 Spring Boot 项目的 pom.xml 文件中,添加 Spring Web 依赖,示例如下:


    
    
        org.springframework.boot
        spring-boot-starter-web
    

若有与 Spring Security 整合等额外需求,还需添加相应依赖 。

创建 WebSocket 配置类

创建一个类,实现 WebSocketConfigurer 接口,用于配置 WebSocket。在该类中,需注册 WebSocket 端点、设置消息代理以及配置拦截器。以下是一个简单示例:

import org.springframework.context.annotation.Configuration;
import org.springframework.messaging.simp.config.MessageBrokerRegistry;
import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
import org.springframework.web.socket.config.annotation.StompEndpointRegistry;
import org.springframework.web.socket.config.annotation.WebSocketMessageBrokerConfigurer;

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {

    @Override
    public void configureMessageBroker(MessageBrokerRegistry config) {
        config.setApplicationDestinationPrefixes("/app");
        config.setUserDestinationPrefix("/user");
    }

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/websocket-endpoint").withSockJS();
    }
}

上述代码中,通过@
EnableWebSocketMessageBroker注解启用了 WebSocket 消息代理。在configureMessageBroker方法中,设置了应用程序的目的地前缀为/app,用户目的地前缀为/user 。在registerStompEndpoints方法中,注册了一个名为/websocket-endpoint的 STOMP 端点,并启用了 SockJS 回退选项,以支持不支持 WebSocket 的浏览器 。

自定义 WebSocket 处理器

创建自定义的 WebSocket 处理器,用于处理消息的收发。示例代码如下:

import org.springframework.web.socket.CloseStatus;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;

import java.io.IOException;
import java.util.HashMap;
import java.util.Map;

public class CustomWebSocketHandler extends TextWebSocketHandler {

    private static final Logger log = LoggerFactory.getLogger(CustomWebSocketHandler.class);
    private final Map sessions = new HashMap<>();

    @Override
    public void afterConnectionEstablished(WebSocketSession session) throws Exception {
        String sessionId = session.getId();
        sessions.put(sessionId, session);
        log.info("WebSocket连接建立:{}", sessionId);
    }

    @Override
    public void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
        String sessionId = session.getId();
        String payload = message.getPayload();
        log.info("收到来自 {} 的消息:{}", sessionId, payload);
        // 这里可根据业务逻辑处理消息,比如广播给其他客户端
        broadcastMessage(payload);
    }

    @Override
    public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
        String sessionId = session.getId();
        sessions.remove(sessionId);
        log.info("WebSocket连接关闭:{}", sessionId);
    }

    @Override
    public void handleTransportError(WebSocketSession session, Throwable exception) throws Exception {
        log.error("WebSocket传输错误", exception);
    }

    // 广播消息给所有连接的客户端
    public void broadcastMessage(String message) {
        sessions.values().forEach(session -> {
            try {
                session.sendMessage(new TextMessage(message));
            } catch (IOException e) {
                log.error("广播消息失败", e);
            }
        });
    }
}

在上述代码中,CustomWebSocketHandler继承自TextWebSocketHandler,重写了多个方法。
afterConnectionEstablished方法在连接建立时被调用,将新建立连接的会话信息存入sessions map 中 。handleTextMessage方法处理接收到的文本消息,记录消息来源和内容,并调用broadcastMessage方法广播消息 。afterConnectionClosed方法在连接关闭时被调用,从sessions map 中移除对应的会话信息 。handleTransportError方法处理传输过程中的错误 。broadcastMessage方法遍历所有会话,将消息发送给每个连接的客户端 。

创建控制器

创建一个 REST 控制器,用于测试消息广播。示例如下:

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

@RestController
@RequestMapping("/api/websocket")
public class WebSocketController {

    private final CustomWebSocketHandler webSocketHandler;

    @Autowired
    public WebSocketController(CustomWebSocketHandler webSocketHandler) {
        this.webSocketHandler = webSocketHandler;
    }

    @PostMapping("/broadcast")
    public ResponseEntity broadcastMessage(@RequestBody String message) {
        webSocketHandler.broadcastMessage(message);
        return ResponseEntity.ok("消息广播成功");
    }
}

在该控制器中,通过依赖注入获取CustomWebSocketHandler实例。broadcastMessage方法接收一个字符串消息,调用CustomWebSocketHandler的broadcastMessage方法进行消息广播,并返回成功响应 。

前端实现

创建一个简单的 HTML 页面,用于与后端的 WebSocket 进行交互,实现消息的发送和接收。示例代码如下




    WebSocket测试


WebSocket测试页面

<script> let ws = null; function connect() { ws = new WebSocket('ws://localhost:8080/websocket-endpoint'); ws.onopen = function () { console.log('WebSocket连接已建立'); appendMessage('系统消息:连接已建立'); }; ws.onmessage = function (event) { appendMessage('收到消息:' + event.data); }; ws.onclose = function () { console.log('WebSocket连接已关闭'); appendMessage('系统消息:连接已关闭'); }; ws.onerror = function (error) { console.error('WebSocket错误:', error); appendMessage('系统消息:连接发生错误'); }; } function sendMessage() { const messageInput = document.getElementById('messageInput'); const message = messageInput.value; if (ws && message) { ws.send(message); appendMessage('发送消息:' + message); messageInput.value = ''; } } function appendMessage(message) { const messagesDiv = document.getElementById('messages'); const messageElement = document.createElement('div'); messageElement.textContent = message; messagesDiv.appendChild(messageElement); } // 页面加载完成后连接WebSocket window.onload = connect; </script>

在上述 HTML 页面中,通过 JavaScript 代码创建了一个 WebSocket 连接,连接地址为
ws://localhost:8080/websocket-endpoint ,与后端注册的 STOMP 端点相对应。connect函数在页面加载完成后被调用,负责建立 WebSocket 连接,并定义了连接建立、收到消息、连接关闭和发生错误时的回调函数 。sendMessage函数在用户点击 “发送” 按钮时被调用,获取用户输入的消息并通过 WebSocket 发送 。appendMessage函数用于将消息显示在页面上 。

总结

通过以上在 Spring Boot3 中对 WebSocket 技术的整合与探讨,我们能够构建出高效、实时的通信应用。这不仅能提升用户体验,还能满足互联网大厂复杂业务场景下对实时数据交互的严格要求。各位互联网大厂的技术开发同仁们,赶快动手实践起来吧,让我们的应用在实时通信领域焕发出新的活力!

Tags:

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表