第一步,在客户端配置
<script> var websocket; if ('WebSocket' in window) { websocket = new WebSocket('ws://127.0.0.1:8080/websocket');//配置Websocket服务器端地址 } else { alert("你的浏览器暂不支持websocket,请更换其他浏览器再试"); } websocket.onopen = function (event) { console.log("建立连接"); }; websocket.onclose = function (event) { console.log("关闭连接"); }; websocket.onmessage = function (event) { console.log("收到消息," + event.data); // 弹窗提示与播放提示音乐 var msg = event.data; if (msg === "秒杀已结束") { $('#seckill-box').html("秒杀结束"); } }; websocket.onerror = function (event) { console.log("websocket异常"); }; /** * readyState状态如下: * CONNECTING:值为0,表示正在连接; OPEN:值为1,表示连接成功,可以通信了; CLOSING:值为2,表示连接正在关闭; CLOSED:值为3,表示连接已经关闭,或者打开连接失败。 */ // 向服务端发送消息(必须为open状态时可发送) if (websocket.readyState === 1) { websocket.send("服务端你好"); } </script>
第二步,在服务端配置
@Configuration public class WebSocketConfig { @Bean public ServerEndpointExporter serverEndpointExporter() { return new ServerEndpointExporter(); } }
@ServerEndpoint("/websocket") @Component @Slf4j public class WebSocketService { /** * 记录当前websocket的连接数(保证线程安全) */ private static LongAdder connectAccount = new LongAdder(); /** *存放每个客户端对应的websocketServer对象(需保证线程安全) */ private static CopyOnWriteArraySet<WebSocketService> webSocketSet = new CopyOnWriteArraySet<>(); /** * 与客户端的连接对象 */ private Session session; /** * 连接成功调用的方法 * @param session */ @OnOpen public void onOpen(Session session) { this.session = session; webSocketSet.add(this); connectAccount.increment(); log.info("有新的连接接入,当前连接数为{}", connectAccount); } /** * 连接关闭时调用 */ @OnClose public void onClose() { webSocketSet.remove(this); connectAccount.decrement(); log.info("有连接关闭,当前连接数为{}", connectAccount); } /** * 收到客户端消息时调用 * @param message */ @OnMessage public void onMessage(String message) { log.info("收到客户端发来的消息,message -> {}", message); } /** * 服务端向客户端发送消息 * @param message */ public void sendMessage(String message) { for (WebSocketService webSocketService : webSocketSet) { try { log.info("【websocket消息】 广播消息, message={}", message); webSocketService.session.getBasicRemote().sendText(message); } catch (IOException e) { log.info("向客户端发送消息失败, {}", e.getMessage()); } } } }
之后就可以在你需要推送消息的地方调用WebSocketService服务了。