springboot整合websocket实现聊天室对话

要实现Spring Boot整合WebSocket实现聊天室对话，你需要遵循以下步骤：

1. 添加依赖

在你的pom.xml文件中添加以下依赖：

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

2. 配置WebSocket

创建一个配置类，继承AbstractWebSocketMessageBrokerConfigurer，并重写相关方法：

import org.springframework.context.annotation.Configuration;
import org.springframework.messaging.simp.config.MessageBrokerRegistry;
import org.springframework.web.socket.config.annotation.AbstractWebSocketMessageBrokerConfigurer;
import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
import org.springframework.web.socket.config.annotation.StompEndpointRegistry;@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {@Overridepublic void configureMessageBroker(MessageBrokerRegistry config) {config.enableSimpleBroker("/topic");config.setApplicationDestinationPrefixes("/app");}@Overridepublic void registerStompEndpoints(StompEndpointRegistry registry) {registry.addEndpoint("/chat").withSockJS();}
}

3. 创建消息控制器

创建一个控制器类，用于处理客户端发送的消息：

import org.springframework.messaging.handler.annotation.MessageMapping;
import org.springframework.messaging.handler.annotation.SendTo;
import org.springframework.stereotype.Controller;@Controller
public class ChatController {@MessageMapping("/send")@SendTo("/topic/messages")public String handleMessage(String message) {return message;}
}

4. 前端页面

创建一个HTML页面，用于显示聊天室和发送消息的表单：

<!DOCTYPE html>
<html>
<head><title>Chat Room</title><script src="https://cdnjs.cloudflare.com/ajax/libs/sockjs-client/1.5.0/sockjs.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/stomp.js/2.3.3/stomp.min.js"></script>
</head>
<body><div id="chatroom"><ul id="messages"></ul></div><form id="form"><input type="text" id="input" placeholder="Type your message here..."><button type="submit">Send</button></form><script>var socket = new SockJS('/chat');var stompClient = Stomp.over(socket);var messagesElement = document.getElementById('messages');var formElement = document.getElementById('form');var inputElement = document.getElementById('input');stompClient.connect({}, function (frame) {console.log('Connected: ' + frame);stompClient.subscribe('/topic/messages', function (message) {var li = document.createElement('li');li.appendChild(document.createTextNode(message.body));messagesElement.appendChild(li);});});formElement.addEventListener('submit', function (event) {event.preventDefault();stompClient.send("/app/send", {}, inputElement.value);inputElement.value = '';});</script>
</body>
</html>