一、pom.xml
<!-- springBoot整合WebSocket --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-websocket</artifactId> </dependency>
二、配置config
@Configuration public class WebMvcConfig { @Bean public ServerEndpointExporter serverEndpointExporter (){ return new ServerEndpointExporter(); } }
三、配置应用服务处理消息
@ServerEndpoint("/websocket") @Component public class MyWebSocket { private static int onlineCount = 0; private static CopyOnWriteArraySet<MyWebSocket> webSocketSet = new CopyOnWriteArraySet<>(); private Session session; @OnOpen public void onOpen (Session session){ this.session = session; webSocketSet.add(this); addOnlineCount(); System.out.println("有新链接加入!当前在线人数为" + getOnlineCount()); } @OnClose public void onClose (){ webSocketSet.remove(this); subOnlineCount(); System.out.println("有一链接关闭!当前在线人数为" + getOnlineCount()); } @OnMessage public void onMessage (String message, Session session) throws IOException { System.out.println("来自客户端的消息:" + message); // 群发消息 for ( MyWebSocket item : webSocketSet ){ item.sendMessage(message); } } public void sendMessage (String message) throws IOException { this.session.getBasicRemote().sendText(message); } public static synchronized int getOnlineCount (){ return MyWebSocket.onlineCount; } public static synchronized void addOnlineCount (){ MyWebSocket.onlineCount++; } public static synchronized void subOnlineCount (){ MyWebSocket.onlineCount--; } }
四、编写html实现连接发送消息
<!DOCTYPE HTML> <html> <head> <base href="localhost://localhost:9011/"> <title>My WebSocket</title> </head> <body> Welcome<br/> <input id="text" type="text"/> <button οnclick="send()">Send</button> <button οnclick="closeWebSocket()">Close</button> <div id="message"> </div> </body> <script type="text/javascript"> var websocket = null; //判断当前浏览器是否支持WebSocket if ('WebSocket' in window) { websocket = new WebSocket("ws://localhost:9011/websocket"); } else { alert('Not support websocket') } //连接发生错误的回调方法 websocket.onerror = function () { setMessageInnerHTML("error"); }; //连接成功建立的回调方法 websocket.onopen = function (event) { setMessageInnerHTML("open"); } //接收到消息的回调方法 websocket.onmessage = function (event) { setMessageInnerHTML(event.data); } //连接关闭的回调方法 websocket.onclose = function () { setMessageInnerHTML("close"); } //监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。 window.onbeforeunload = function () { websocket.close(); } //将消息显示在网页上 function setMessageInnerHTML(innerHTML) { document.getElementById('message').innerHTML += innerHTML + '<br/>'; } //关闭连接 function closeWebSocket() { websocket.close(); } //发送消息 function send() { var message = document.getElementById('text').value; websocket.send(message); } </script> </html>
五、启动服务访问静态页面省略