一、添加依赖
<!--webSocket依赖--> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-websocket</artifactId> <version>4.3.23.RELEASE</version> </dependency> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-messaging</artifactId> <version>4.3.23.RELEASE</version> </dependency>
二、配置websocket
@Configuration @EnableWebSocket public class SpringWebSocketConfig implements WebSocketConfigurer{ @Override public void registerWebSocketHandlers(WebSocketHandlerRegistry webSocketHandlerRegistry) { webSocketHandlerRegistry.addHandler(webSocketHandler(), "/mysocket/test"); } @Bean public WebSocketHandler webSocketHandler() { return new CustomizeWebSocketHandler(); } }
三、websocket服务端
import org.springframework.web.socket.CloseStatus; import org.springframework.web.socket.TextMessage; import org.springframework.web.socket.WebSocketSession; import org.springframework.web.socket.handler.TextWebSocketHandler; import java.io.IOException; /** * 使用Spring提供的websocket包 * WebSocketMessage * TextMessage * */ public class CustomizeWebSocketHandler extends TextWebSocketHandler { /** * 建立连接后触发的回调 */ @Override public void afterConnectionEstablished(WebSocketSession session) throws Exception { TextMessage textMessage = new TextMessage("#####连接成功"); session.sendMessage(textMessage); } /** * 收到消息时触发的回调 */ @Override public void handleTextMessage(WebSocketSession session, TextMessage message) throws IOException { System.out.println("收到客户端信息:" + new String(message.asBytes())); session.sendMessage(new TextMessage(("服务端收到数据：" + new String(message.asBytes())))); } /** * 传输消息出错时触发的回调 */ @Override public void handleTransportError(WebSocketSession session, Throwable exception) throws Exception { session.sendMessage(new TextMessage("服务端传输信息时出错了")); } /** * 断开连接后触发的回调 */ @Override public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception { } /** * 是否处理分片消息 */ @Override public boolean supportsPartialMessages() { return true; } }
四、websocket客户端
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> Welcome<br/><input id="text" type="text"/> <button onclick="send()">发送消息</button> <hr/> <button onclick="closeWebSocket()">关闭WebSocket连接</button> <hr/> <div id="message"></div> </body> <script> var websocket = null; //判断当前浏览器是否支持WebSocket if ('WebSocket' in window) { websocket = new WebSocket("ws://localhost:8080/mysocket/test"); } else { alert('当前浏览器 Not support websocket') } //连接发生错误的回调方法 websocket.onerror = function () { setMessageInnerHTML("WebSocket连接发生错误"); }; //连接成功建立的回调方法 websocket.onopen = function () { setMessageInnerHTML("WebSocket连接成功"); } //接收到消息的回调方法 websocket.onmessage = function (event) { setMessageInnerHTML(event.data); } //连接关闭的回调方法 websocket.onclose = function () { setMessageInnerHTML("WebSocket连接关闭"); } //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。 window.onbeforeunload = function () { closeWebSocket(); } //将消息显示在网页上 function setMessageInnerHTML(innerHTML) { document.getElementById('message').innerHTML += innerHTML + '<br/>'; } //关闭WebSocket连接 function closeWebSocket() { websocket.close(); } //发送消息 function send() { var message = document.getElementById('text').value; websocket.send(message); } </script> </html>
五、测试
1. websocket.jsp的controller
@Controller public class WebSocketController { @GetMapping("/websocket") public String websocketPage(){ return "websocket"; } }
2. 启动项目，localhost:8080/websocket