WebSocket实现HTML+SpringBoot聊天功能,小程序+SpringBoot聊天功能
以下是一个简化的Spring Boot后端实现WebSocket聊天功能的代码示例:
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.handler.TextWebSocketHandler;
import java.util.concurrent.ConcurrentHashMap;
public class ChatWebSocketHandler extends TextWebSocketHandler {
private static final ConcurrentHashMap<String, WebSocketSession> users = new ConcurrentHashMap<>();
@Override
public void afterConnectionEstablished(WebSocketSession session) throws Exception {
users.put(session.getId(), session);
System.out.println("新用户加入:" + session.getId());
}
@Override
protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
String payload = message.getPayload();
System.out.println("收到消息:" + payload);
// 广播消息
users.values().forEach(user -> {
try {
user.sendMessage(new TextMessage(payload));
} catch (Exception e) {
e.printStackTrace();
}
});
}
@Override
public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
users.remove(session.getId());
System.out.println("用户已离开:" + session.getId());
}
}
在Spring Boot中配置WebSocket的配置类:
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.config.annotation.*;
@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {
@Override
public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
registry.addHandler(chatWebSocketHandler(), "/chat-endpoint")
.setAllowedOrigins("*");
}
@Bean
public ChatWebSocketHandler chatWebSocketHandler() {
return new ChatWebSocketHandler();
}
}
前端HTML和JavaScript代码示例:
<!DOCTYPE html>
<html>
<head>
<title>WebSocket Chat</title>
</head>
<body>
<div>
<input type="text" id="messageText" />
<button onclick="sendMessage()">Send</button>
</div>
<div id="chatWindow">
<!-- Messages will appear here -->
</div>
<script>
var ws;
function connect() {
ws = new WebSocket("ws://localhost:8080/chat-endpoint");
ws.onmessage = function(event) {
评论已关闭