JAVA整合WebSocket实现服务器消息推送(项目源码)

admin

一.WebSocket简单介绍
　　随着互联网的发展，传统的HTTP协议已经很难满足Web应用日益复杂的需求了。近年来，随着HTML5的诞生，WebSocket协议被提出，它实现了浏览器与服务器的全双工通信，扩展了浏览器与服务端的通信功能，使服务端也能主动向客户端发送数据。
; W+ T2 M4 z  G7 M　　我们知道，传统的HTTP协议是无状态的，每次请求（request）都要由客户端（如 浏览器）主动发起，服务端进行处理后返回response结果，而服务端很难主动向客户端发送数据；这种客户端是主动方，服务端是被动方的传统Web模式 对于信息变化不频繁的Web应用来说造成的麻烦较小，而对于涉及实时信息的Web应用却带来了很大的不便，如带有即时通信、实时数据、订阅推送等功能的应 用。在WebSocket规范提出之前，开发人员若要实现这些实时性较强的功能，经常会使用折衷的解决方法：轮询（polling）和Comet技术。其实后者本质上也是一种轮询，只不过有所改进。
1 y. Z4 }; K. C. J　　轮询是最原始的实现实时Web应用的解决方案。轮询技术要求客户端以设定的时间间隔周期性地向服务端发送请求，频繁地查询是否有新的数据改动。明显地，这种方法会导致过多不必要的请求，浪费流量和服务器资源。
　　Comet技术又可以分为长轮询和流技术。长轮询改进了上述的轮询技术，减小了无用的请求。它会为某些数据设定过期时间，当数据过期后才会向服务端发送请求；这种机制适合数据的改动不是特别频繁的情况。流技术通常是指客户端使用一个隐藏的窗口与服务端建立一个HTTP长连接，服务端会不断更新连接状态以保持HTTP长连接存活；这样的话，服务端就可以通过这条长连接主动将数据发送给客户端；流技术在大并发环境下，可能会考验到服务端的性能。
- f5 A' J9 r6 Y. E! _/ ?　　这两种技术都是基于请求-应答模式，都不算是真正意义上的实时技术；它们的每一次请求、应答，都浪费了一定流量在相同的头部信息上，并且开发复杂度也较大。
　　伴随着HTML5推出的WebSocket，真正实现了Web的实时通信，使B/S模式具备了C/S模式的实时通信能力。WebSocket的工作流程是这 样的：浏览器通过javaScript向服务端发出建立WebSocket连接的请求，在WebSocket连接建立成功后，客户端和服务端就可以通过 TCP连接传输数据。因为WebSocket连接本质上是TCP连接，不需要每次传输都带上重复的头部数据，所以它的数据传输量比轮询和Comet技术小 了很多。本文不详细地介绍WebSocket规范，主要介绍下WebSocket在Java Web中的实现。
: P! c5 ~3 i& ~  U" H  G　　JavaEE 7中出了JSR-356:Java API for WebSocket规范。不少Web容器，如Tomcat,Nginx,Jetty等都支持WebSocket。Tomcat从7.0.27开始支持 WebSocket，从7.0.47开始支持JSR-356，下面的Demo代码也是需要部署在Tomcat7.0.47以上的版本才能运行。
$ p. i4 M# v! D, D5 S% p- Y5 B  _
二、WebSocket协议介绍
7 m( Y0 O- h, i$ N6 y" W$ j　WebSocket协议是一种双向通信协议，它建立在TCP之上，同http一样通过TCP来传输数据，但是它和http最大的不同有两点：1.WebSocket是一种双向通信协议，在建立连接后，WebSocket服务器和Browser/UA都能主动的向对方发送或接收数据，就像Socket一样，不同的是WebSocket是一种建立在Web基础上的一种简单模拟Socket的协议；2.WebSocket需要通过握手连接，类似于TCP它也需要客户端和服务器端进行握手连接，连接成功后才能相互通信。简单的建立握手的时序图如下：

  b/ h0 o; d5 O, A6 A% e# n握手过程：
Browser与WebSocket服务器通过TCP三次握手建立连接，如果这个建立连接失败，那么后面的过程就不会执行，Web应用程序将收到错误消息通知。
3 E; u' |, F/ A7 T1 z; R在TCP建立连接成功后，Browser/UA通过http协议传送WebSocket支持的版本号，协议的字版本号，原始地址，主机地址等等一些列字段给服务器端。
WebSocket服务器收到Browser/UA发送来的握手请求后，如果数据包数据和格式正确，客户端和服务器端的协议版本号匹配等等，就接受本次握手连接，并给出相应的数据回复，同样回复的数据包也是采用http协议传输。
Browser收到服务器回复的数据包后，如果数据包内容、格式都没有问题的话，就表示本次连接成功，触发onopen消息，此时Web开发者就可以在此时通过send接口想服务器发送数据。否则，握手连接失败，Web应用程序会收到onerror消息，并且能知道连接失败的原因。

三、Tomcat 7中的Websocket架构

如图所示，因为Websocket通信分为握手和数据传输两个过程，两个过程中需要用到的处理方式是不一样的，握手过程是基于HTTP 1.1基础上的，而数据传输是直接基于TCP的流传输。
       握手过程中，在HttpServletRequest的基础上，封装了WsHttpServletRequest类，添加了对Request的失效操作函数invalidate()。而在数据通信时，接受和处理数据过程中，基于org.apache.coyote.http11.upgrade.UpgradeInbound重新封装了用于处理数据输入流的类StreamInbound，并在StreamInbound的基础上扩展生成了用于消息处理的类MessageInbound。在这两个数据处理类中均留有onData，onTextData/onBinaryData，onOpen，onClose等事件操作函数接口，这些接口将在载入的代码类中实现业务逻辑。在用于数据输出流的类WsOutbound则是封装了UpgradeOutbound对象实例，基于UpgradeOutbound对象的基础上，添加了websocket响应有关的处理逻辑。这里处理函数均为同步调用的函数，保证websocket响应的时序性。
. F& r) W6 [+ n8 w, P1 F       Tomcat中Websocket的处理流程如下：
: L6 J  ?0 V$ f3 w) r接收客户端发来的握手请求，Coyote.http11连接器对socket进行解析，形成HttpServletRequest发送给Container。
7 \; f+ l. y  `5 s" H+ c. ^, |* wContainer中的相应WebsocketServlet处理请求，如不接受连接请求，则返回，如接受连接请求，则对请求作出响应，建立起客户端和服务器的socket连接。
* D( S2 z+ w4 `' w- j  H1 G服务器此时可以通过WsOutbound发送数据给客户端，同时通过StreamInbound监听socket。
9 \6 s$ R$ Q, m0 B1 b3 R: J' i如果接收到客户端发来的数据，则将socket数据解析成frame，判断frame类型，通过事件分发数据到不同的逻辑处理流程。
# i8 k3 U; T( ]+ r数据返回时调用WsOutbound对返回的数据进行封装处理，发送给客户端。

6 W( p+ W. V# p5 t& Z四、代码实现以及需求
6 ]' a3 N3 H/ g& e9 x6 i6 R4 @
1、项目需要，定时向所有在线用户推送一个广告或是推送一个通知之类的(比如服务器升级，请保存好手头工作之类的)。
: B6 g9 ?0 k, ?
2、相关环境 ， Nginx、tomcat7、centos 6.5
. \$ u1 h; Q5 ]2 l0 k
3、项目框架，springMvc 4.0.6、layer
. ]0 _- Y; ]! T7 |
4、代码实现：

, f- F% |* x$ \  `WebSocketConfig：

1. import websocket.handler.SystemWebSocketHandler;
   # m1 G* E0 x2 h: G( S( q* K; U- l
2. @Configuration
   9 [) p6 T* m; J
3. @EnableWebMvc
   ; W. t  L2 _0 ~& i/ W% A' N
4. @EnableWebSocket
   
5. public class WebSocketConfig extends WebMvcConfigurerAdapter implements WebSocketConfigurer{
   
6. 
   3 W. P& d0 y; V
7.     @Override
   2 h3 T! H- j3 s7 R; ~) O
8.     public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
   
9.          registry.addHandler(systemWebSocketHandler(),"/webSocketServer");
   + Z2 T2 B& Q8 Y/ z& P* W; z/ M1 z/ {
10.          registry.addHandler(systemWebSocketHandler(),"/sockjs/webSocketServer");
    
11.     }
    
12.     @Bean
    ; P8 P4 h8 r# [7 J. @' e; P
13.     public WebSocketHandler systemWebSocketHandler(){
    ( Q5 K* @9 {3 c/ O
14.         return new SystemWebSocketHandler();
    
15.     }
    
16. }

复制代码

SystemWebSocketHandler：
4 m# g8 G( H- S# p$ p- d

1. public class SystemWebSocketHandler extends  TextWebSocketHandler {
   
2. 
   
3. 
   
4.     private static final ArrayList<WebSocketSession> users = new ArrayList<WebSocketSession>();;
   ' w3 Q  p$ c5 E/ X0 R
5. 
   % m$ _( m8 c" C- q# n
6.     public void afterConnectionEstablished(WebSocketSession session) throws Exception {
   
7.         System.out.println("ConnectionEstablished");
   8 J7 G, _' ]# u" U$ M
8.         users.add(session);
   ( l- I+ j; ^$ j7 `! w* P4 _, @
9.         System.out.println("当前用户"+users.size());
   ) u: g& J" V4 q0 a! ]
10.     }
    ' i: i5 j, g. r( H0 ]5 T  x* i* D
11.     /**
    
12.      * 在UI在用js调用websocket.send()时候，会调用该方法
    
13.      * @Author    张志朋
    % a( h/ ]8 b+ p2 w8 L. k; }
14.      * @param session
    ; a+ A* H6 u9 r: `7 ?! P
15.      * @param message
    
16.      * @throws Exception
    ( P1 r6 u. G7 E7 B3 N) e3 I7 b
17.      * @Date    2016年3月4日
    . ?* U2 u; O) s+ ]  O
18.      * 更新日志
    
19.      * 2016年3月4日 张志朋  首次创建
    
20.      *
    + j9 z- Y4 e. V6 m% E3 s
21.      */
    6 R  _& y! n6 Y) ^, U; n
22.     @Override
    " F" W- M6 q, s9 O
23.     protected void handleTextMessage(WebSocketSession session,
    - B6 P! m) Y( c8 z6 `$ H
24.             TextMessage message) throws Exception {
    
25.         super.handleTextMessage(session, message);
    
26.         sendMessageToUsers(session,message);
    - p  k& c! A; M; K
27.     }
    
28.     @Override
    
29.     public void handleTransportError(WebSocketSession session, Throwable exception) throws IOException {
    
30.         if(session.isOpen()){
    . ^- n( `+ ^- ~1 Y" C
31.             session.close();
    4 U' q* o' ]) `8 N; Z
32.         }
      p' \% Z$ }, N9 E" |0 n7 t
33.         users.remove(session);
    ! ?, v9 r/ r5 Y; I9 l+ T1 [
34.     }
    & y9 T: X6 i9 e0 K4 R! m
35. 
    
36.     @Override
    
37.     public void afterConnectionClosed(WebSocketSession session, CloseStatus closeStatus) throws Exception {
    
38.         users.remove(session);
    
39.     }
    
40. 
    
41.     @Override
    
42.     public boolean supportsPartialMessages() {
    
43.         return false;
    9 Q6 I  o% G/ }' d: L2 u' d
44.     }
    / p  a! r# w6 i$ R2 T; V- @4 @% l4 @
45.     /**
    
46.      * 给所有在线用户发送消息
    
47.      * @Author    张志朋
    
48.      * @param message  void
    
49.      * @Date    2016年3月4日
    / _5 ]! t( U$ n$ K4 `& Q
50.      * 更新日志
    2 w/ s. R' Z1 V
51.      * 2016年3月4日 张志朋  首次创建
    
52.      *
    3 x6 l- m$ F: f/ X) B' f* R
53.      */
    
54.     public void sendMessageToUsers(WebSocketSession session,TextMessage message) {
    
55.         for (WebSocketSession user : users) {
    . c1 ?$ s3 l4 X
56.             try {
    
57.                 if (user.isOpen()) {
    ' m9 k2 _1 m. w$ n! }
58.                     user.sendMessage(message);
    
59.                 }
    * Y& ^# B- h3 i; W
60.             } catch (IOException e) {
    
61.                 e.printStackTrace();
    2 ]# t8 U' }2 J
62.             }
    7 }: x, M# o; M% W0 a
63.         }
    $ n4 G& l, O* D# f
64.     }
    
65. }
    7 }* l' j# q3 ?$ Z$ y; n- r

复制代码

信息输入 index.html：

1. <html xmlns="http://www.w3.org/1999/xhtml">
   0 M' J7 A  g: ?9 {! J* M
2. <head>
   
3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   . i1 C4 G" M  b
4. <title>请输入任意消息</title>
   
5. <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
   ; B* l" ]+ d; r
6. <script src="http://cdn.sockjs.org/sockjs-0.3.min.js"></script>
   
7. <script type="text/javascript">
   
8. var ws = null;
   
9. $(function () {
   
10.     if ('WebSocket' in window) {
    
11.          ws = new WebSocket('ws://127.0.0.1:8080/webSocketServer');
    # k6 ~4 q, x+ w4 ?0 x
12.     }
    
13.     else if ('MozWebSocket' in window) {
    ! V! f) @& _& F5 ?. p1 M7 j( i# H
14.         ws = new MozWebSocket("ws://127.0.0.1:8080/webSocketServer");
    ( [3 A" |$ O  b, s3 s! |/ c
15.     }
    - w: ^3 E1 ?6 E. ~/ J' V+ y+ j
16.     else {
    
17.         ws = new SockJS("ws://127.0.0.1:8080/webSocketServer");
    
18.     }
    : P: X& h. X% _( \' f
19.     ws.onopen = function () {
    
20. 
    
21.     };
    " C7 M8 E! o6 h/ d! H# y
22.     ws.onmessage = function (event) {
    
23. 
    ( A" n% Q! x( b+ b; i- M
24.     };
    ' |% q6 Z5 q; b% {4 R
25.     ws.onclose = function (event) {
    
26. 
    
27.     };
    " i2 R# ], X+ h0 Y9 u  x
28. });
    2 B2 ?" o& m0 Z3 ^
29. function stop(){
      B6 k! [- z1 U6 f
30.     var message = $("#message").val();
    5 S; n+ k# E% I. W! p6 Q
31.     ws.send(message);
    
32. }
    , a# c# q4 P$ ^6 q2 Q* L8 `' v+ x7 P
33. </script>
    
34. </head>
    
35. <body class="keBody">
    
36. 请输入提示信息: <textarea id="message"></textarea><br />
    1 z7 T% z/ C) X  `2 l
37. <input type="button"  value="开始" />
    
38. </body>
    
39. </html>

复制代码

% W- c- B% b! x- M/ SwebSocket.js  用于导入项目。

1. document.write("<script language=javascript src='http://127.0.0.1:8080/js/jquery-1.10.2.min.js'></script>");
   & f7 I8 ?/ w7 \
2. document.write("<script language=javascript src='http://127.0.0.1:8080/layer/layer.js'></script>");
   
3. document.write("<script language=javascript src='http://cdn.sockjs.org/sockjs-0.3.min.js'></script>");
   
4.     var ws = null;
   " j' t$ e; C; h) G3 s' t' n$ H, {
5.     var basePath = "ws://127.0.0.1:8080/";
   $ M+ u' [+ Z1 M1 S& x
6.     if ('WebSocket' in window) {
   ; H* ^: g% f9 C2 r
7.          ws = new WebSocket(basePath+'webSocketServer');
   
8.     }
   
9.     else if ('MozWebSocket' in window) {
   . J) Z; G) ]/ j8 I
10.         ws = new MozWebSocket(basePath+"webSocketServer");
    5 u% K1 U5 y+ _/ t0 M+ v" t4 n6 E
11.     }
    
12.     else {
    ; W/ ^7 z& V7 u! b& c& W# X
13.         ws = new SockJS(basePath+"sockjs/webSocketServer");
    
14.     }
    : P0 Y7 C# Q% J/ ]3 u# y
15.     ws.onopen = function () {
    
16. 
    
17.     };
    ! ]( e# M1 _. o/ o1 H: G
18.     ws.onmessage = function (event) {
    
19.         pop(event.data);
    
20.     };
    
21.     ws.onclose = function (event) {
    - L, {/ j9 w% _+ r  B
22.          ws.close();
    1 x# F& \" A- J8 B: \" ]
23.     };
    
24. //提示信息
    , p" a, E5 g9 O8 J. t
25. function pop(message){
    # k# g3 q- Z. w7 Z" L' u
26.     layer.alert(message);
    ) b' j& U# x( ?2 Z, R1 C
27. }

复制代码

5、在项目头部引入
<script language=javascript src='http://127.0.0.1:8080/webSocket.js '></script>

4 G$ B) O! z0 s* k& ~, x
这时查看后台 会有以下信息 说明 引入成功。
0 q# b# ^, a5 ]( B6 w
& B# h4 F9 r# A# }. E: R# x
" Y$ ]5 t) U$ v; a+ R然后在打开页面 index.html 输入以下内容 点击开始即可。

) [/ @/ u. y8 [6 f  H9 J
1 M2 O! z1 c( d, W$ i如果在网站出现一下提示说明配置成功，这时候所有网站登录用户都可以收到此信息。

) Q+ [3 _: i, S( {
/ U9 Q; Z+ r  L8 |, w& x9 {
6 q4 E( t; `6 I$ r7 Z) [8 y项目下载地址：

游客，如果您要查看本帖隐藏内容请回复

8 o/ q, N( k/ \) v3 f
9 M1 M- n: ~# E2 z7 W, P0 i
7 [# W5 B5 T, S. G9 j; R5 [  a  N0 I

admin

刘继仆 发表于 2016-4-21 07:20
有没有数据库？

4 G, `" K6 B# B6 h# z6 J跟 数据库 没有关系

admin

beyond 发表于 2016-4-27 03:50
8 J9 F8 @( [# o1 C# w: i& e5 i111111111111111111

我去 盗我 头像 还不好好回复

admin

destiny123 发表于 2016-5-4 01:20
- ~' m0 _# I5 B( `- j4 ~即时通讯 是这个意思吗

, D+ J) D* s. |/ e  S% I差不多吧

admin

刘继仆 发表于 2016-4-21 07:20
有没有数据库？

5 H/ K& c" A* L' A9 b$ r出来l

admin

javaWeb12 发表于 2016-10-31 09:22
; t6 W: e) g7 }' ~- H) d* r都这么高级了，完全看不懂

好久 没来了哈