SpringBoot整合WebSocket

最新推荐文章于 2023-02-09 15:44:29 发布

原创最新推荐文章于 2023-02-09 15:44:29 发布 · 402 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#SpringBoot整合WebSocket #WebSocket #消息推送 #服务器主动推送 #新消息提醒

SpringBoot系列同时被 2 个专栏收录

4 篇文章

订阅专栏

WebSocket

1 篇文章

订阅专栏

本文详细介绍了如何在Spring Boot项目中集成WebSocket，包括添加依赖、配置WebSocket服务、实现具体业务逻辑及前端页面交互。通过实例演示了单发与群发消息的过程。

不懂WebSocket的小伙伴们，可以去这个地方先看一下https://www.zhihu.com/question/20215561

GitHub：https://github.com/AAAJYH/SpringBoot.git

1.添加依赖

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

2.设置WebSocket终端服务

package com.websocket.configuration;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.server.standard.ServerEndpointExporter;
import javax.websocket.server.ServerEndpoint;

@Configuration
public class WebSocketConfig {

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

}

3.WebSocket具体实现类

package com.websocket.configuration;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Component;
import javax.websocket.*;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.ArrayList;

/** websocket终端请求路径 */
@ServerEndpoint("/webSocket")
@Component
public class WebSocketServer {

    private static Logger logger = LoggerFactory.getLogger(WebSocketServer.class);

    /**与某个客户端的连接会话，需要通过它来给客户端发送数据 */
    private static ArrayList<WebSocketServer> webSocketServers = new ArrayList<WebSocketServer>();

    private Session session;

    /**
     * 连接建立成功调用的方法
     * @param session
     */
    @OnOpen
    public void onOpen(Session paramSession){
        /** 添加当前session到集合中 */
        this.session = paramSession;
        webSocketServers.add(this);
        logger.info("连接成功");
    }

    /**
     * 收到客户端消息后调用的方法
     * @param message   客户端发送过来的消息
     * @param session
     */
    @OnMessage
    public void onMessage(String message,Session session){
        logger.info("收到客户端发过来的消息message："+ message);
    }

    /**
     * 连接关闭调用的方法
     */
    @OnClose
    public void onClose(){
        webSocketServers.remove(this);
        logger.info("连接已关闭，移除当前对象");
    }

    /**
     * 连接发生错误时
     * @param session
     * @param error
     */
    @OnError
    public void onError(Session session,Throwable error){
        error.printStackTrace();
        logger.info("发生错误" );
    }

    /**
     * 发消息
     * @param txt
     */
    public void sendMessage(Session paramSession, String txt){
        try{
            paramSession.getBasicRemote().sendText(txt);
        }catch(Exception e){
            e.printStackTrace();
        }
    }

    /**
     * 群发消息
     * @param message
     */
    public static void massMessage(String message) throws IOException {
        for (WebSocketServer webSocketServer: webSocketServers) {
            webSocketServer.sendMessage(webSocketServer.session, message);
        }
        logger.info("群发消息message："+ message);
    }
}

4.HTML页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        if ("WebSocket" in window){
            /** 打开websocket连接 */
            var ws = new WebSocket("ws://localhost:8081/webSocket");
            ws.onopen = function(){
                console.log("连接成功");
            };
            ws.onmessage = function (evt){
                var msg = evt.data;
                console.log("接收到的数据："+msg);
            };
            ws.onclose = function(){
                console.log("连接已关闭")
            };
        }else {
            /** 浏览器不支持 WebSocket */
            console.log("您的浏览器不支持 WebSocket!");
        }

        /** 发消息 */
        function send(){
            ws.send("{msg:哈哈哈, type:前台}");
        }
    </script>
</head>
<body>
    <button onclick="send()">发消息</button>
</body>
</html>

5.控制层

package com.websocket.controller;
import com.websocket.configuration.WebSocketServer;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import java.io.IOException;

@Controller
public class WebSocketController {

    /**
     * websocket页面跳转
     * @return
     */
    @RequestMapping("/webSocketTest")
    public String webSocketTest(){
        return "/websocket/webSocket.html";
    }

    /**
     * 服务器主动推送（群发）
     * @param msg
     * @return
     * @throws IOException
     */
    @RequestMapping("/sendMessage")
    @ResponseBody
    public String sendMessage(String msg) throws IOException {
        WebSocketServer.massMessage(msg);
        return "OK";
    }
}

彳亍了开始测试，在浏览器访问websocket页面http://localhost:8081/webSocketTest（可以多打开几个，这样群发效果更明显），Console打印连接成功