Sping WebSocket SockJS使用

2019独角兽企业重金招聘Python工程师标准>>>

注意点：

1、Spring Framework从4.0版本开始支持websocket，示例代码使用的是4.1.3

2、SockJs是一个封装的WebSocket实现，可以支持低版本的IE浏览器。

3、SockJs+Spring-WebSocket时，由于SockJs与Spring WebSocket之间采用JSON通讯，需要引入jackson 2的相关jar包。

4、项目需要使用到Spring MVC。

 

具体代码实现（小例子）：

1、Spring WebSocket配置类

Java代码 

 

1. package com.watcher.websocket.spring;  
2.   
3. import org.springframework.context.annotation.Bean;  
4. import org.springframework.context.annotation.Configuration;  
5. import org.springframework.web.socket.config.annotation.EnableWebSocket;  
6. import org.springframework.web.socket.config.annotation.WebSocketConfigurer;  
7. import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;  
8.   
9. @Configuration  //配置类  
10. @EnableWebSocket  //声明支持websocket  
11. public class WebSocketConfig implements WebSocketConfigurer{  
12.   
13.     @Override  
14.     public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {  
15.   
16.         //注册websocket实现类，指定参数访问地址;allowed-origins="*" 允许跨域  
17.         registry.addHandler(myHandler(), "/ws").addInterceptors(myHandshake()).setAllowedOrigins("*");  
18.         //允许客户端使用SockJS  
19.         registry.addHandler(myHandler(), "/sockjs/ws").addInterceptors(myHandshake()).withSockJS();  
20.     }  
21.       
22.     @Bean  
23.     public MyHandler myHandler(){  
24.         return new MyHandler();  
25.     }  
26.   
27.     @Bean  
28.     public MyHandshakeInterceptor myHandshake(){  
29.         return new MyHandshakeInterceptor();  
30.     }  
31.       
32.   
33. }  

 

2、Handler类实现（用于处理具体的消息）

Java代码 

 

1. package com.watcher.websocket.spring;  
2.   
3. import org.springframework.web.socket.CloseStatus;  
4. import org.springframework.web.socket.TextMessage;  
5. import org.springframework.web.socket.WebSocketHandler;  
6. import org.springframework.web.socket.WebSocketMessage;  
7. import org.springframework.web.socket.WebSocketSession;  
8.   
9. //extending either TextWebSocketHandler orBinaryWebSocketHandler  
10. public class MyHandler implements WebSocketHandler {  
11.       
12.       
13.   
14.     @Override  
15.     public void afterConnectionClosed(WebSocketSession arg0, CloseStatus arg1) throws Exception {  
16.         // TODO Auto-generated method stub  
17.           
18.         System.out.println("Connection closed..."+arg0.getRemoteAddress().toString());  
19.           
20.     }  
21.   
22.     @Override  
23.     public void afterConnectionEstablished(WebSocketSession arg0) throws Exception {  
24.         // TODO Auto-generated method stub  
25.         System.out.println("Connection established..."+arg0.getRemoteAddress().toString());  
26.     }  
27.   
28.     @Override  
29.     public void handleMessage(WebSocketSession arg0, WebSocketMessage<?> arg1) throws Exception {  
30.         // TODO Auto-generated method stub  
31.          try {  
32.              System.out.println("Req: "+arg1.getPayload());  
33.             TextMessage returnMessage = new TextMessage(arg1.getPayload()    
34.                       + " received at server");    
35.              arg0.sendMessage(returnMessage);  
36.         } catch (Exception e) {  
37.             e.printStackTrace();  
38.         }    
39.     }  
40.   
41.     @Override  
42.     public void handleTransportError(WebSocketSession arg0, Throwable arg1) throws Exception {  
43.         // TODO Auto-generated method stub  
44.         if(arg0.isOpen()){  
45.             arg0.close();  
46.         }  
47.         System.out.println(arg1.toString());  
48.         System.out.println("WS connection error,close...");  
49.     }  
50.   
51.     @Override  
52.     public boolean supportsPartialMessages() {  
53.         // TODO Auto-generated method stub  
54.         return false;  
55.     }  
56.   
57.       
58.       
59. }  

 3、握手拦截器实现（拦截器...）

Java代码 

 

1. package com.watcher.websocket.spring;  
2.   
3. import java.util.Map;  
4.   
5. import org.springframework.http.server.ServerHttpRequest;  
6. import org.springframework.http.server.ServerHttpResponse;  
7. import org.springframework.web.socket.WebSocketHandler;  
8. import org.springframework.web.socket.server.support.HttpSessionHandshakeInterceptor;  
9.   
10. /** 
11.  *  
12.  * 类描述：握手拦截器 
13.  * com.watcher.websocket.spring  MyHandshakeInterceptor 
14.  * Created by 78098 on 2016年11月15日. 
15.  * version 1.0 
16.  */  
17. public class MyHandshakeInterceptor extends HttpSessionHandshakeInterceptor{  
18.   
19.     @Override  
20.     public void afterHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler wsHandler, Exception ex) {  
21.         // TODO Auto-generated method stub  
22.         System.out.println("After handshake "+request.getRemoteAddress().toString());  
23.         super.afterHandshake(request, response, wsHandler, ex);  
24.     }  
25.   
26.     @Override  
27.     public boolean beforeHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler handler, Map<String, Object> map) throws Exception {  
28.         // TODO Auto-generated method stub  
29.         System.out.println("Before handshake "+request.getRemoteAddress().toString());  
30.         return super.beforeHandshake(request, response, handler, map);  
31.     }  
32.   
33.       
34.       
35. }  

 4、页面

Html代码 

 

1. <!DOCTYPE html>  
2. <html>  
3. <head>  
4. <meta charset="UTF-8">  
5. <title>Insert title here</title>  
6. <script type="text/javascript" src="./plugin/sockjs/sockjs-1.1.1.js"></script>  
7. <script type="text/javascript">  
8.     var url = "192.168.120.37:8080/springMybatis";  
9.     var websocket = null;  
10.     if ('WebSocket' in window) {  
11.         websocket = new WebSocket("ws://" + url + "/ws");  
12.     } else {  
13.         websocket = new SockJS("http://" + url + "/sockjs/ws");  
14.     }  
15.     websocket.onopen = onOpen;  
16.     websocket.onmessage = onMessage;  
17.     websocket.onerror = onError;  
18.     websocket.onclose = onClose;  
19.   
20.     function onOpen(openEvent) {  
21.         document.getElementById("console").innerHTML = document.getElementById("console").innerHTML+ "OPEN<br/>";  
22.     }  
23.   
24.     function onMessage(event) {  
25.         document.getElementById("console").innerHTML = document.getElementById("console").innerHTML+ event.data+"<br/>";  
26.     }  
27.     function onError() {  
28.     }  
29.     function onClose() {  
30.         document.getElementById("console").innerHTML = document.getElementById("console").innerHTML+ "CLOSE<br/>";  
31.     }  
32.   
33.     function doSend() {  
34.         console.log(websocket.readyState);  
35.         if (websocket.readyState == SockJS.OPEN) {  
36.             var msg = document.getElementById("message").value;  
37.             websocket.send(msg);  
38.         } else {  
39.             alert("连接失败!");  
40.         }  
41.     }  
42.       
43.       
44.     function disconnect(){  
45.         if (websocket != null) {  
46.             websocket.close();  
47.             websocket = null;  
48.         }  
49.     }  
50.       
51.     function reconnect(){  
52.         if (websocket != null) {  
53.             websocket.close();  
54.             websocket = null;  
55.         }  
56.         if ('WebSocket' in window) {  
57.             websocket = new WebSocket("ws://" + url + "/ws");  
58.         } else {  
59.             websocket = new SockJS("http://" + url + "/sockjs/ws");  
60.         }  
61.         websocket.onopen = onOpen;  
62.         websocket.onmessage = onMessage;  
63.         websocket.onerror = onError;  
64.         websocket.onclose = onClose;  
65.     }  
66. </script>  
67. </head>  
68. <body>  
69.     <div>  
70.         <button id="disconnect" οnclick="disconnect()">断开连接</button>  
71.         <button id="send" οnclick="doSend()">发送消息</button>  
72.         <button id="reconnect" οnclick="reconnect()">重新连接</button>  
73.     </div>  
74.     <div>  
75.        <textarea id="message" style="width: 350px">Here is a message!</textarea>  
76.     </div>  
77.     <div>日志信息：</div>  
78.     <p id="console" width="600px"></p>  
79. </body>  
80. </html>  

转载于:https://my.oschina.net/martin123/blog/869053