springBoot快速搭建WebSocket

'会飞的猪

已于 2024-07-30 16:48:26 修改

阅读量63

点赞数 1

于 2024-07-30 16:47:44 首次发布

本文链接：https://blog.csdn.net/weixin_43832604/article/details/140800900

版权

添加依赖
在pom.xml中加入WebSocket相关依赖：

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

创建SocketHandler（我们socket的消息类型有两种：TextMessage 类型用于处理文本帧， BinaryMessage 类型用于处理二进制帧）
创建MyWebSocketHandler处理文本帧

import org.springframework.stereotype.Component;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;

@Component
public class MyWebSocketHandler extends TextWebSocketHandler {

    @Override
    protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
        String payload = message.getPayload();//接收到的消息
        System.out.println("Received: " + payload);
        session.sendMessage(new TextMessage(payload));
    }
}

创建MyBinaryWebSocketHandler处理二进制帧

import org.springframework.stereotype.Component;
import org.springframework.web.socket.BinaryMessage;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.BinaryWebSocketHandler;

import java.nio.ByteBuffer;

@Component
public class MyBinaryWebSocketHandler extends BinaryWebSocketHandler {

    @Override
    public void handleBinaryMessage(WebSocketSession session, BinaryMessage message) throws Exception {
        // 从BinaryMessage中获取二进制数据
        ByteBuffer byteBuffer = message.getPayload();
        // 这里可以处理接收到的二进制数据
        while (byteBuffer.hasRemaining()) {
            byte b = byteBuffer.get();
            // 处理每一个字节
            System.out.println("Received byte: " + b);
        }
        //发送二进制响应
        //session.sendMessage(new BinaryMessage(byteBuffer));
        //或发送文本响应
        session.sendMessage(new TextMessage("111111"));
    }
}

创建WebSocketConfig

import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;

@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {

    private final MyWebSocketHandler myWebSocketHandler;

    private final MyBinaryWebSocketHandler myBinaryWebSocketHandler;

    public WebSocketConfig(MyWebSocketHandler myWebSocketHandler, MyBinaryWebSocketHandler myBinaryWebSocketHandler) {
        this.myWebSocketHandler = myWebSocketHandler;
        this.myBinaryWebSocketHandler = myBinaryWebSocketHandler;
    }

    @Override
    public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
        registry.addHandler(myWebSocketHandler, "/TextMessage").setAllowedOrigins("*");//接收/TextMessage结尾的文本消息
        registry.addHandler(myBinaryWebSocketHandler, "/BinaryMessage").setAllowedOrigins("*");//接收/BinaryMessage结尾的二进制帧消息
    }
}

创建前端页面index.html 文件，包含一个简单的 WebSocket 客户端

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>WebSocket Demo</title>
</head>
<body>
    <h1>WebSocket Demo</h1>
    <button onclick="connect()">Connect</button>
    <button onclick="disconnect()">Disconnect</button>
    <br>
    <input type="text" id="message" placeholder="Enter message">
    <button onclick="sendMessage()">Send</button>
    <ul id="messages"></ul>
 
    <script>
        var webSocket;
 
        function connect() {
            webSocket = new WebSocket('ws://localhost:8080/TextMessage');
 
            webSocket.onmessage = function(event) {
                var messages = document.getElementById('messages');
                var message = document.createElement('li');
                message.textContent = event.data;
                messages.appendChild(message);
            };
 
            webSocket.onopen = function(event) {
                console.log('Connected to WebSocket');
            };
 
            webSocket.onclose = function(event) {
                console.log('Disconnected from WebSocket');
            };
        }
 
        function disconnect() {
            if (webSocket) {
                webSocket.close();
            }
        }
 
        function sendMessage() {
            var messageInput = document.getElementById('message');
            var message = messageInput.value;
            webSocket.send(message);
            messageInput.value = '';
        }
    </script>
</body>
</html>

运行应用程序
运行 Spring Boot 应用程序，然后浏览器打开 index.html。你应该会看到一个简单的 WebSocket 客户端界面。
点击 “Connect” 按钮连接到 WebSocket 服务器，输入消息并点击 “Send” 按钮发送消息。你应该会在页面上看到服务器返回的 “Echo” 消息。