[快速上手] SpringBoot集成Websocket

最新推荐文章于 2024-09-23 13:42:12 发布

@gzhi

最新推荐文章于 2024-09-23 13:42:12 发布

阅读量546

点赞数

分类专栏：辅助开发的CV区文章标签： websocket spring boot java

本文链接：https://blog.csdn.net/u013969018/article/details/124887507

版权

辅助开发的CV区专栏收录该内容

2 篇文章 0 订阅

订阅专栏

让你的SpringBoot快速添加Websocket

1. 一个demo (可CV食用)
2. 原生websocket测试前端页面
3. 实际开发的问题与解决方法

1. 一个demo (可CV食用)

1.1 maven依赖

<dependency>
   <groupId>org.springframework.boot</groupId>
   <artifactId>spring-boot-starter-websocket</artifactId>
</dependency>

1.2 配置类 WebsocketConfig

import org.springframework.web.socket.server.standard.ServerEndpointExporter;

@Configuration
public class WebsocketConfig {
    @Bean
    public ServerEndpointExporter serverEndpointExporter() {
        return new ServerEndpointExporter();
    }
}

1.3 Websocket服务连接管理类

/**
 * websocket连接实例,一个连接对应一个实例，此时的WebsocketConn并非单例
 * "/websocket" 是前端用js连接用的url
 *
 * @author lhy
 */
@Component
@ServerEndpoint("/websocket")
public class WebsocketConn {

    /*
     websocket客户端连接列表
     */
    public final static Map<String, WebsocketConn> WEBSOCKET_CONNECTS = new ConcurrentHashMap<>();

    /**
     * 客户端唯一标识
     */
    private String name;

    /**
     * 会话
     */
    private Session session;

    /**
     * 客户端连接服务端时
     *
     * @param session 连接会话
     */
    @OnOpen
    public void onOpen(Session session) {
        this.session = session;
        // 根据自己的需求，从url取参数
        name = session.getRequestParameterMap().get("name").get(0);
        // 将name作为这个会话的索引，放入map中保存
        WEBSOCKET_CONNECTS.put(name, this);
    }

    /**
     * 与客户端的websocket连接关闭时
     */
    @OnClose
    public void onClose() {
        WEBSOCKET_CONNECTS.remove(name);
    }

    /**
     * 收到客户端发来的消息时
     *
     * @param message 消息内容
     * @return 响应给客户端的内容
     */
    @OnMessage
    public String onMessage(String message) {
        System.out.println("收到:" + message);
        return "收到了你的消息：" + message;
    }

    /**
     * 给指定用户发送消息
     *
     * @param name    名称
     * @param message 消息内容
     */
    public static void send(String name, String message) {
        Optional.ofNullable(WEBSOCKET_CONNECTS.get(name)).ifPresent(x -> x.session.getAsyncRemote().sendText(message));
    }
}

2. 原生websocket测试前端页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>websocket测试页</title>
</head>
<body>
<br/><input id="text" type="text"/>
<button onclick="send()">发送消息</button>
<hr/>
<button onclick="closeWebSocket()">关闭WebSocket连接</button>
<hr/>
<div id="message"></div>
</body>

<script type="text/javascript">
    var websocket = null;
    //判断当前浏览器是否支持WebSocket  stomp
    if ('WebSocket' in window) {
        websocket = new WebSocket('ws://localhost:12000/websocket?name=test');
    }
    else {
        alert('当前浏览器 Not support websocket')
    }

    //连接发生错误的回调方法
    websocket.onerror = function () {
        setMessageInnerHTML("WebSocket连接发生错误");
    };

    //连接成功建立的回调方法
    websocket.onopen = function () {
        setMessageInnerHTML("WebSocket连接成功");
    }

    //接收到消息的回调方法
    websocket.onmessage = function (event) {
        console.log('订阅到数据：', event.data)
        setMessageInnerHTML(event.data);
    }

    //连接关闭的回调方法
    websocket.onclose = function () {
        setMessageInnerHTML("WebSocket连接关闭");
    }

    //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
    window.onbeforeunload = function () {
        closeWebSocket();
    }

    //将消息显示在网页上
    function setMessageInnerHTML(innerHTML) {
        document.getElementById('message').innerHTML += innerHTML + '<br/>';
    }

    //关闭WebSocket连接
    function closeWebSocket() {
        websocket.close();
    }

    //发送消息
    function send() {
        var message = document.getElementById('text').value;
        websocket.send(message);
    }
</script>
</html>

3. 实际开发的问题与解决方法

欢迎评论区留言自己遇到的问题或者更好的解决办法

用户的websocket连接管理
- 如果用户的唯一标识比较简单，类似demo里，就可以参考上面的实现方式：用map将用户名标识和具体的websocket连接一一对应，发送消息的也是用上面的静态send方法。
- 如果用户的唯一标识复杂，仅靠url不方面传参，可以尝试在onMessage方法里让用户发送一个复杂的唯一标识和初始化内容。
报错：[TEXT_FULL_WRITING]
详细报错提示：The remote endpoint was in state [TEXT_FULL_WRITING] which is an invalid state for called method
频繁使用或多线程使用 getAsyncRemote().sendText() 可能会异常，优化后的send方法：

    /**
     * \@SneakyThrows 需要引入lombok依赖
     */
    @SneakyThrows
    public synchronized void send(String message) {
        session.getBasicRemote().sendText(message);
    }

    public static void send(String name, String message) {
        Optional.ofNullable(WEBSOCKET_CONNECTS.get(name)).ifPresent(x -> x.send(message));
    }