Spring Boot SockJS应用例子

1.SockJS用javascript实现的socket连接，兼容各种浏览器的WebSocket支持库
2.WebSocket是H5的，不支持H5的浏览器没法使用。
3.SockJS它提供类似于websocket的编程模式但是可以适应不同的浏览器（包括不支持websocket的浏览器）。

后端代码：

1. <dependency>
2. <groupId>org.springframework.boot</groupId>
3. <artifactId>spring-boot-starter-websocket</artifactId>
4. </dependency>

1. package com.cesmart;
2. import org.springframework.boot.SpringApplication;
3. import org.springframework.boot.autoconfigure.EnableAutoConfiguration;
4. import org.springframework.context.ApplicationContext;
5. import org.springframework.context.annotation.ComponentScan;
6. @EnableAutoConfiguration
7. @ComponentScan(basePackages = "com.cesmart") // 扫描那些包得到bean.@ComponentScan({"com.teradata.notification","com.teradata.dal"})
8. public class Application {
9. public static void main(String[] args) {
10. ApplicationContext applicationContext = SpringApplication.run(Application.class, args);
11. }
12. }

1. package com.cesmart.config;
2. import org.springframework.web.socket.CloseStatus;
3. import org.springframework.web.socket.TextMessage;
4. import org.springframework.web.socket.WebSocketHandler;
5. import org.springframework.web.socket.WebSocketMessage;
6. import org.springframework.web.socket.WebSocketSession;
7. public class MyHandler implements WebSocketHandler {
8. // 连接继开处理
9. @Override
10. public void afterConnectionClosed(WebSocketSession arg0, CloseStatus arg1) throws Exception {
11. // TODO Auto-generated method stub
12. System.out.println("Connection closed..." + arg0.getRemoteAddress().toString());
13. }
14. // 连接建立处理
15. @Override
16. public void afterConnectionEstablished(WebSocketSession arg0) throws Exception {
17. // TODO Auto-generated method stub
18. System.out.println("Connection established..." + arg0.getRemoteAddress().toString());
19. }
20. // 接收、发送信息处理
21. @Override
22. public void handleMessage(WebSocketSession arg0, WebSocketMessage<?> arg1) throws Exception {
23. // TODO Auto-generated method stub
24. try {
25. System.out.println("Req: " + arg1.getPayload());
26. // 发送信息
27. TextMessage returnMessage = new TextMessage(arg1.getPayload() + " received at server");
28. arg0.sendMessage(returnMessage);
29. } catch (Exception e) {
30. e.printStackTrace();
31. }
32. }
33. // 错误处理（客户端突然关闭等接收到的错误）
34. @Override
35. public void handleTransportError(WebSocketSession arg0, Throwable arg1) throws Exception {
36. // TODO Auto-generated method stub
37. if (arg0.isOpen()) {
38. arg0.close();
39. }
40. System.out.println(arg1.toString());
41. System.out.println("WS connection error,close...");
42. }
43. @Override
44. public boolean supportsPartialMessages() {
45. // TODO Auto-generated method stub
46. return false;
47. }
48. }

1. package com.cesmart.config;
2. import java.util.Map;
3. import org.springframework.http.server.ServerHttpRequest;
4. import org.springframework.http.server.ServerHttpResponse;
5. import org.springframework.web.socket.WebSocketHandler;
6. import org.springframework.web.socket.server.support.HttpSessionHandshakeInterceptor;
7. /**
8. * 类描述：拦截器
9. */
10. public class MyHandshakeInterceptor extends HttpSessionHandshakeInterceptor {
11. @Override
12. public void afterHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler wsHandler,
13. Exception ex) {
14. // TODO Auto-generated method stub
15. System.out.println("After handshake " + request.getRemoteAddress().toString());
16. super.afterHandshake(request, response, wsHandler, ex);
17. }
18. @Override
19. public boolean beforeHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler handler,
20. Map<String, Object> map) throws Exception {
21. // TODO Auto-generated method stub
22. System.out.println("Before handshake " + request.getRemoteAddress().toString());
23. return super.beforeHandshake(request, response, handler, map);
24. }
25. }

1. package com.cesmart.config;
2. import org.springframework.context.annotation.Bean;
3. import org.springframework.context.annotation.Configuration;
4. import org.springframework.web.socket.config.annotation.EnableWebSocket;
5. import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
6. import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;
7. @Configuration // 配置类
8. @EnableWebSocket // 声明支持websocket
9. public class WebSocketConfig implements WebSocketConfigurer {
10. @Override
11. public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
12. // 注册websocket实现类，指定参数访问地址;allowed-origins="*" 允许跨域
13. // addHandler是增加处理接口和设定URL
14. // addInterceptors是增加拦截器处理（可以不用）
15. registry.addHandler(myHandler(), "/ws").addInterceptors(myHandshake()).setAllowedOrigins("*");
16. registry.addHandler(myHandler(), "/sockjs/ws").addInterceptors(myHandshake()).withSockJS();
17. registry.addHandler(myHandler(), "/ws2").setAllowedOrigins("*");
18. registry.addHandler(myHandler(), "/sockjs/ws2").setAllowedOrigins("*").withSockJS();
19. }
20. @Bean
21. public MyHandler myHandler() {
22. return new MyHandler();
23. }
24. @Bean
25. public MyHandshakeInterceptor myHandshake() {
26. return new MyHandshakeInterceptor();
27. }
28. }

前端代码：

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

参考（websocket简单应用）：http://wiselyman.iteye.com/blog/2003336
参考（应用例子）：http://768992698.iteye.com/blog/2338250
参考（应用例子（TextWebSocketHandler ））：http://www.cnblogs.com/likun10579/p/5594828.html