在Spring Boot中集成WebSocket来实现一个聊天宝功能,你需要做以下几步:
- 添加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'
- 配置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");
}
}
- 创建消息模型:
创建一个简单的消息载体类,例如
ChatMessage
。
public class ChatMessage {
private String from;
private String text;
// Getters and Setters...
}
- 创建消息处理器: 创建一个控制器来处理发送和接收消息。
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; // 这里可以添加逻辑,比如记录消息、过滤内容等等
}
}
- 前端集成:
在客户端,你可以使用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
资源: