在Spring Boot中集成WebSocket来实现一个聊天宝功能,你需要做以下几步:

  1. 添加WebSocket依赖: 如果你使用的是Maven,需要在pom.xml文件中添加Spring Boot的spring-boot-starter-websocket依赖。
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-websocket</artifactId>
</dependency>

对于Gradle,你需要添加以下依赖到build.gradle文件中:

implementation 'org.springframework.boot:spring-boot-starter-websocket'
  1. 配置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 registerStompEndpoints(StompEndpointRegistry registry) {
        // 注册WebSocket端点,客户端将使用它连接到WebSocket服务器。
        registry.addEndpoint("/chat").withSockJS();
    }

    @Override
    public void configureMessageBroker(MessageBrokerRegistry registry) {
        // 配置一个简单的消息代理,客户端可以订阅的地址前缀为"/topic"
        registry.enableSimpleBroker("/topic");
        // 定义了客户端发送消息的路径前缀,即应用的目的地前缀
        registry.setApplicationDestinationPrefixes("/app");
    }
}
  1. 创建消息模型: 创建一个简单的消息载体类,例如ChatMessage
public class ChatMessage {
    private String from;
    private String text;

    // Getters and Setters...
}
  1. 创建消息处理器: 创建一个控制器来处理发送和接收消息。
import org.springframework.messaging.handler.annotation.MessageMapping;
import org.springframework.messaging.handler.annotation.SendTo;
import org.springframework.stereotype.Controller;

@Controller
public class ChatController {

    @MessageMapping("/message") // 客户端发送消息的地址
    @SendTo("/topic/reply")    // 广播消息的地址
    public ChatMessage sendMessage(ChatMessage chatMessage) {
        return chatMessage; // 这里可以添加逻辑,比如记录消息、过滤内容等等
    }
}
  1. 前端集成: 在客户端,你可以使用SockJS和STOMP来连接到WebSocket服务器,并发送或接收消息。
    下面是一个HTML页面的简单示例:
<!DOCTYPE html>
<html>
<head>
    <title>WebSocket Chat</title>
    <script src="https://cdn.jsdelivr.net/npm/sockjs-client/dist/sockjs.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/stomp-websocket/lib/stomp.min.js"></script>
</head>
<body>
    <input type="text" id="name" placeholder="Enter your name"/>
    <textarea id="chat" rows="10" cols="30" disabled></textarea>
    <input type="text" id="message" placeholder="Type a message..."/>
    <button onclick="sendMessage()">Send</button>

    <script type="text/javascript">
        var stompClient = null;

        function connect() {
            var socket = new SockJS('/chat');
            stompClient = Stomp.over(socket);
            stompClient.connect({}, function (frame) {
                stompClient.subscribe('/topic/reply', function (greeting) {
                    var message = JSON.parse(greeting.body);
                    document.getElementById('chat').value += message.from + ": " + message.text + "\n";
                });
            });
        }

        function sendMessage() {
            var from = document.getElementById('name').value;
            var text = document.getElementById('message').value;
            stompClient.send("/app/message", {}, JSON.stringify({'from': from, 'text': text}));
        }

        connect();
    </script>
</body>
</html>

按照以上步骤,你就可以在Spring Boot应用程序中集成WebSocket,并实现一个基本的聊天宝功能。客户端页面允许用户输入他们的名字和消息,然后点击“发送”按钮来发送消息。所有连接的用户都能够实时看到新的聊天消息。

测试:

http://localhost:8080/index.html

springboot集成websocket实现一个简易聊天室_springboot

资源:

springboot集成websocket实现一个简易聊天室_websocket_02