今天偶然看到 websocket 的相关问题，学习整理一下，也实际的试了一发，确实比较好用。如下：
总的来说，要实现服务器端往客户端推送，还是用 socket 通信会比较合适。目前主流的浏览器也基本都支持的还不错，手机端也没啥问题。下面直接看实现。
添加 websocket 依赖
<dependency> <groupId>javax.websocket</groupId> <artifactId>javax.websocket-api</artifactId> <version>1.1</version> <scope>provided</scope> </dependency>
java 后台有继承类和注解的两种使用方式。注解的比较简单清晰，下面的测试是用的注解的方式。
直接上 java 代码
// 对应的访问地址，{userId}是参数，后面可以通过 @PathParam("userId")来获取 @ServerEndpoint(value="/websocketTest/{userId}") public class TestWebsocketController { private Logger logger = LoggerFactory.getLogger(TestWebsocketController.class); private static String userId; //建立连接 @OnOpen public void onOpen(@PathParam("userId") String userId, Session session) { this.userId = userId; logger.debug("new connection: {}", userId); } //关闭连接 @OnClose public void onClose() { logger.debug("close connection: {}", this.userId); } //收到客户端消息 @OnMessage public void onMessage(String message, Session session) throws IOException, InterruptedException { logger.debug("received message from {}: {}", this,userId, message); session.getBasicRemote().sendText("received " + this.userId + " message"); // 连续给客户端发送信息 sendIntervalMsg(session); } //出错 @OnError public void onError(Session session, Throwable error) { logger.debug("user id : {} connection has error", this.userId); error.printStackTrace(); } //测试，后台连续给客户端发送信息 public static void sendIntervalMsg(Session session) throws IOException, InterruptedException { for(int i = 0;i<10;i++) { Thread.sleep(1000); session.getBasicRemote().sendText("send from server " + i + " message"); } } }
上面的 java 代码应该写的很清楚了。下面来看客户端(此处是 web)的代码
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> websocket Demo---- user000 <br /> <input id="text" type="text" /> <button onclick="send()"> Send </button> <button onclick="closeWebSocket()"> Close </button> <div id="message"> </div> <script type="text/javascript"> //判断当前浏览器是否支持WebSocket if('WebSocket' in window){ websocket = new WebSocket("ws://localhost:8082/websocketTest/user000"); console.log("link success") }else{ alert('Not support websocket') } //连接发生错误的回调方法 websocket.onerror = function(){ setMessageInnerHTML("error"); }; //连接成功建立的回调方法 websocket.onopen = function(event){ setMessageInnerHTML("open"); } console.log("-----") //接收到消息的回调方法 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> </body> </html>
这个也不用太多介绍，整体来看还是比较简单实现的。建立连接的请求头如下，会跟一般的 http 请求有些区别
成功之后后台会连续给前端发送消息，如下：
本文参考这篇博客
欢迎来到这里！
我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。
注册 关于