|
如果你要有一个支持 WebSocket的服务器(Java、Php等),可以在浏览器中使用一个新的WebSocket服务协议,来打开一个链接: - <font color="rgb(0, 0, 136)">var</font> socket = <font color="rgb(0, 0, 136)">new</font> WebSocket(<font color="rgb(0, 153, 0)">"ws://172.0.0.1:8080/SpringWebSocketPush/websck"</font>);
复制代码2 z/ \5 m: _" x
与http://这一URL 前缀等价的WebSocket 前缀 是 ws:// ,安全 WebSocket 则有一个与http://等价的 wss:// 前缀。 $ v. U4 o$ ]* |0 z
/ h q% P2 a g( R- b9 e" r% j- Z1 l0 s
该套接口对象有四个用来监听套接口事件的回调: - socket.onopen = function(){! C9 n- }4 o1 J# U9 Z$ F
n& F9 P0 ]8 I C5 a* D# V; X- //打开
5 D, H# w7 G. u+ A1 ~
% ?4 A) d$ l& {- o7 Y) Q$ ^: Y- }
- ^4 w& Y W9 _* p6 S# [' a
0 l5 [& d: K* c1 {; q$ Y) Z
* i$ t# Z9 G9 Y: d$ }# k8 E- F- socket.onmessage = function(){9 d2 n$ u5 T- y* l$ i4 c5 C2 ~
* L# @* _7 [6 H$ p& d7 J- //在event.data消息数据
l' r+ I/ _' q( p# o - . ]& {7 g; A5 N# P3 X
- } I7 J" K+ x) T- n0 K
; C- M& _+ K0 |7 _( F9 R; f6 S- socket.onclose = function(){4 D j: z b: B2 x
; v( `0 }1 X0 E/ K6 Q- //关闭WebSocket
) R! j5 P( ?8 j1 c# m1 B
* M% `7 D0 i$ C7 P' b! X4 U k- }
. c6 P$ \. R/ W1 X2 ^/ v
/ x I7 P* O: m$ U% v- socket.onerror = function(){( s: s- f! a! Z k4 Z
2 A5 y1 O. \9 d# u. `- //错误触发
% v6 w. m9 y0 N. I, B$ ^+ w2 I
2 x; t) v" I$ t3 U- }
复制代码 ; c1 z- q b/ S8 I! Z+ r: x) p
通过套接口发送数据,调用socket.send: - <font color="rgb(79, 79, 79)">socket</font>.<font color="rgb(79, 79, 79)">send</font>(message)
复制代码
( Y6 _7 | B* x0 W0 Q/ j4 E! o* c5 X/ m' X& A1 w# L
代码附上: - <!DOCTYPE html>; n3 |. o1 ]/ S1 {' }
- <html>
( ^2 Y( @1 k: u - 2 A" d. h ~, V; p
- <head>( P, Q/ e4 a% B- L
- <meta charset="UTF-8">1 b9 i O8 p6 U4 Z- y8 P
- <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
& Z# Y5 q3 ?" o' b1 S5 R - <title>WebSocket</title>- G) g& O/ M+ S4 r2 g: Z' \
- </head>" D; \" u8 l! B5 J \2 i
2 f1 | z0 P# t+ A5 H7 ^# T5 b- <body>6 Y1 U9 L# f2 D/ @1 b1 `( F
- </body>
( T- `( f3 L( ~- F8 h; C+ I( l3 y( T - <script>2 s J( T, @+ j* Y$ J
- var socket;7 S, d1 g3 @4 V& `/ Y5 x$ P n
- if (window.WebSocket) {; \1 f* [! s( h
- socket = new WebSocket("ws://localhost:8080/myapp");, @2 h6 m- ^2 r8 }8 T" s7 Q. G
- socket.onmessage = function(event) {0 S6 w( f$ L/ v: v* m1 I
- alert("Received data from websocket: " + event.data);
7 T0 ^* x6 [% H8 Z - }+ G6 g0 M% ]: S! r+ k
- socket.onopen = function(event) {
9 _6 `# C Y2 v7 L/ B - alert("Web Socket opened!");
" u5 l' P0 F4 o/ b( ?, ~- } - };
5 T- |0 k6 K I1 n& e: l - socket.onclose = function(event) {/ z+ F7 y$ G1 ?. `( `7 K
- alert("Web Socket closed.");
3 D' k% G: u }9 L - };
& E5 i; [0 q7 D0 y$ f1 N - } else {. e1 y& B9 S" D/ J& x$ X% t j2 k
- alert("Your browser does not support Websockets. (Use Chrome)");
. X0 `: _ Q- o' C( c0 { - }
( C; E- _+ E4 t0 v$ |1 H - * P) a1 ?7 q4 ]
- function send(message) {
l: G" F1 d8 d; H+ O+ m - if (!window.WebSocket) {! X2 e k& p1 N* J" {8 S" ?
- return;$ v: \& u1 A9 c0 { N# K
- }
( _9 w i5 C7 r- x1 n6 b6 e) _) | - if (socket.readyState == WebSocket.OPEN) {* N, E& O1 X4 y! r/ n o% [
- socket.send(message);
' r9 b- c' ]' b4 @9 k6 O - } else {
$ m* M( O. O( W7 D1 Y - alert("The socket is not open.");
1 T3 q9 v6 T3 P# }, |. E9 ]# n5 F - }
' y5 N0 Q7 s8 k [+ e; t& O# f - }* h: F- H( E i' G3 p3 y
- </script>. P: ]2 k0 `3 J9 o
* ?5 Z2 u2 x, p) M' C8 c- </html>
复制代码
! Y4 y9 U2 l+ P; T2 X- o+ @4 Y# Y' R
|