vue，java，webSocket通讯，服务端主动给多客户端发消息

vue在那个页面内：

created() {// 可以在created钩子中初始化WebSocket连接this.initWebSocket();},
data: () => {return {webSocket: null, // WebSocket对象},
},
beforeDestroy() {// 组件销毁前关闭WebSocket连接if (this.webSocket) {this.webSocket.close();}
},
methods: {initWebSocket() {// 替换为你的WebSocket服务端地址const wsUrl = "ws://192.168.200.131:8059/clientSocket";this.webSocket = new WebSocket(wsUrl);// 打开连接this.webSocket.onopen = () => {console.log("WebSocket连接已打开");};// 接收消息this.webSocket.onmessage = (event) => {console.log("接收到服务器消息:", event.data);// 处理接收到的数据this.handleData(event.data);};// 连接关闭this.webSocket.onclose = () => {console.log("WebSocket连接已关闭");// 可以在这里实现重连逻辑this.reconnectWebSocket();};// 连接错误this.webSocket.onerror = (error) => {console.error("WebSocket发生错误:", error);};},handleData(data) {// 处理接收到的数据this.onLinePlate_3500Q();this.onLinePlate_3500T();this.onLinePlate_2800Q();this.onLinePlate_2800T();},reconnectWebSocket() {// 实现重连逻辑setTimeout(() => {this.initWebSocket();}, 5000); // 5秒后重连},},

java:
1.pom.xml

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

2.启动类application

@Beanpublic ThreadPoolTaskScheduler taskScheduler(){ThreadPoolTaskScheduler taskScheduler = new ThreadPoolTaskScheduler();taskScheduler.setPoolSize(10);taskScheduler.initialize();return taskScheduler;}

3.新建一个WebSocketConfig.java

package com.alnan.unit.WebSocket;import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;
import org.springframework.web.socket.server.standard.ServerEndpointExporter;/*** @author * @date **/
@Configuration
@EnableWebSocket
//public class WebSocketConfig implements WebSocketConfigurer {
public class WebSocketConfig {//    @Override
//    public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
//        registry.addHandler(new WebSocketHandler(), "/clientSocket").setAllowedOrigins("*");
//    }@Beanpublic ServerEndpointExporter serverEndpoint() {return new ServerEndpointExporter();}/*** 注意事项：* WebSocket启动的时候优先于spring容器，从而导致在WebSocketServer中调用业务Service会报空指针异常* 所以需要在WebSocketServer中将所需要用到的service给静态初始化一下* 此处提前注入*/
//    @Autowired
//    private void setXxx(XxxService xxxService) {
//        WebSocketServer.xxxService = xxxService;
//    }
}

4.新建一个WebSocketServer类

package com.alnan.unit.WebSocket;import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Component;import javax.websocket.*;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.concurrent.CopyOnWriteArraySet;/*** @author * @date 2023/11/8* @description: 若在此类中直接调用service方法失败，需要加上：public static XxxService xxxService; 另外在config中注入实例**/
@Slf4j
@Component
@ServerEndpoint(value = "/clientSocket")
public class WebSocketServer {/*** 当前连接数*/private static int onlineCount = 0;/*** concurrent包的线程安全Set，用来存放每个客户端对应的MyWebSocket对象*/private static CopyOnWriteArraySet<WebSocketServer> webSocketSet = new CopyOnWriteArraySet<>();/*** 与某个客户端的连接会话，需要通过它来给客户端发送数据*/private Session session;/*** 接收的用户id*/private String userId;/*** 连接建立成功调用的方法,客户端进来请求这个，并返回*/@OnOpenpublic void onOpen(Session session) {this.session = session;webSocketSet.add(this);addOnlineCount();        //在线数加1log.info("有新连接加入！当前在线人数为" + getOnlineCount());try {sendMessage("连接成功");} catch (IOException e) {log.error("websocket IO异常", e);}}/*** 连接关闭调用的方法*/@OnClosepublic void onClose() {webSocketSet.remove(this);subOnlineCount();               //在线数减1log.info("有一连接关闭！当前在线人数为" + getOnlineCount());}/*** 收到客户端消息后调用的方法** @param message 客户端发送过来的消息*/@OnMessagepublic void onMessage(String message) {log.info("来自客户端的消息:" + message);//群发消息for (WebSocketServer item : webSocketSet) {try {item.sendMessage(message);} catch (IOException e) {log.error("发送消息失败", e);}}}/*** @param error 错误*/@OnErrorpublic void onError( Throwable error) {log.error("发生错误", error);}/*** 发送消息* @param message 消息* @throws IOException 异常*/public void sendMessage(String message) throws IOException {this.session.getBasicRemote().sendText(message);}/*** 群发自定义消息*/public static void sendInfo(String message) {log.info("消息内容：" + message);for (WebSocketServer item : webSocketSet) {try {//这里可以设定只推送给这个sid的，为null则全部推送item.sendMessage(message);} catch (IOException e) {log.error("消息发送失败", e);}}}/*** 获取在线人数* @return 在线人数*/public static synchronized int getOnlineCount() {return onlineCount;}/*** 在线人数加一*/public static synchronized void addOnlineCount() {WebSocketServer.onlineCount++;}/*** 在线人数减一*/public static synchronized void subOnlineCount() {WebSocketServer.onlineCount--;}
}

5.后端调用方法，主动给客户端发消息

  WebSocketServer.sendInfo("dataReload");