Java 后端websocket 推送前端实现实时刷新

在Java后端使用WebSocket推送信息到前端实现实时刷新的过程涉及到几个关键步骤。下面是一个简单的示例，展示了如何使用Spring Boot和WebSocket来实现这个功能。

首先，你需要添加Spring WebSocket的依赖到你的pom.xml文件：

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

然后，你需要创建一个WebSocket的配置类，该类将负责处理WebSocket的服务器端点：

import org.springframework.context.annotation.Configuration;import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;import org.springframework.web.socket.config.annotation.WebSocketMessageBrokerConfigurer;import org.springframework.web.socket.config.annotation.StompEndpointRegistry;import org.springframework.web.socket.config.annotation.AbstractWebSocketMessageBrokerConfigurer;import org.springframework.web.socket.config.annotation.PathVariableMapping;import org.springframework.web.socket.config.annotation.PathVariableMessageHandlerRegistry;import org.springframework.web.socket.config.annotation.SessionMappingMessageHandlerRegistry;@Configuration@EnableWebSocketMessageBrokerpublic class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {@Overridepublic void configureMessageBroker(MessageBrokerRegistry config) {config.enableSimpleBroker("/topic").setApplicationDestinationPrefixes("/app");}@Overridepublic void registerStompEndpoints(StompEndpointRegistry registry) {registry.addEndpoint("/websocket").withSockJS();}}

接下来，你需要创建一个控制器，该控制器将处理WebSocket的连接和消息发送：

import org.springframework.messaging.simp.SimpMessageTemplate;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;import org.springframework.web.socket.*;@Controllerpublic class WebSocketController {private SimpMessageTemplate messageTemplate;public WebSocketController(SimpMessageTemplate messageTemplate) {this.messageTemplate = messageTemplate;}@MessageMapping("/send/{message}")public void send(@PathVariable String message) {messageTemplate.convertAndSend("/topic/public", message);}}

在上述代码中，我们使用SimpMessageTemplate来发送消息。"/send/{message}"是一个消息映射，它将处理来自客户端的WebSocket消息。消息将被发送到"/topic/public"路径。

最后，你需要在前端使用JavaScript来连接WebSocket并接收消息。例如，使用SockJS和stompjs库可以很容易地实现这个功能：

var socket = new SockJS('/websocket');// 创建SockJS连接var stompClient = Stomp.over(socket);// 创建stomp客户端stompClient.connect({}, function(frame) {// 连接后，发送一个“connect”帧console.log('Connected: ' + frame);// 打印连接信息stompClient.subscribe('/topic/public', function(message){// 订阅“/topic/public”路径的消息console.log('Received: ' + message);// 打印接收到的消息});});

在上述代码中，我们首先创建了一个SockJS连接，然后创建了一个stomp客户端。当连接成功后，我们订阅了"/topic/public"路径的消息。当接收到消息时，我们将其打印到控制台。