java 实现 springboot项目 使用socket推送消息,前端实时进行接收后端推送的消息
时间: 2023-07-16 22:15:25 浏览: 119
要实现使用 Socket 推送消息并且前端可以实时接收的功能,可以按照以下步骤进行:
1. 在 SpringBoot 项目中引入 WebSocket 相关依赖,例如 `spring-boot-starter-websocket`。
2. 创建一个 WebSocket 配置类,继承自 `WebSocketConfigurer` 接口,并实现其中的 `registerWebSocketHandlers` 方法。该方法中需要注册一个 `WebSocketHandler`,用于处理 WebSocket 请求。
3. 创建一个 `WebSocketHandler` 类,继承自 `TextWebSocketHandler` 类,重写其中的 `handleTextMessage` 方法,用于处理接收到的 WebSocket 消息。在该方法中,可以将消息推送给前端。
4. 在前端页面中,使用 JavaScript 创建一个 WebSocket 连接,连接到后端的 WebSocket 服务。然后监听该连接的 `onmessage` 事件,用于处理接收到的消息。
以下是一个简单的示例代码:
WebSocket 配置类:
```java
@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {
@Override
public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
registry.addHandler(new MyWebSocketHandler(), "/ws").setAllowedOrigins("*");
}
}
```
WebSocketHandler 类:
```java
public class MyWebSocketHandler extends TextWebSocketHandler {
private List<WebSocketSession> sessions = new CopyOnWriteArrayList<>();
@Override
public void afterConnectionEstablished(WebSocketSession session) {
sessions.add(session);
}
@Override
protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
for (WebSocketSession s : sessions) {
s.sendMessage(message);
}
}
}
```
前端页面代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>WebSocket Test</title>
</head>
<body>
<div id="msg"></div>
<script>
var ws = new WebSocket("ws://localhost:8080/ws");
ws.onmessage = function(event) {
var msg = event.data;
document.getElementById("msg").innerHTML += "<p>" + msg + "</p>";
};
</script>
</body>
</html>
```
以上示例代码仅供参考,具体实现需要根据实际情况进行调整。
阅读全文