|
如果你要有一个支持 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>);
复制代码
& E3 M! f/ [/ I与http://这一URL 前缀等价的WebSocket 前缀 是 ws:// ,安全 WebSocket 则有一个与http://等价的 wss:// 前缀。 7 t# ^( \: w& _; w9 W5 Q
+ c: l- |5 O2 x6 Z) n9 L& E: r% n- @: l* T- F5 Y
该套接口对象有四个用来监听套接口事件的回调: - socket.onopen = function(){
% ]8 i/ a% u9 s$ T3 ^
9 F" Z+ V7 r- v' I+ v- //打开& t( g3 v1 V. N+ a
; W% ]+ b9 ?) B/ a- F! N6 n- }
) F' q6 s5 x# z6 p
- |5 x. q2 x. C/ z' V
: u$ H5 s. F! Z5 v' \- socket.onmessage = function(){6 t: L# X9 ?8 ^/ t4 k) H
5 p8 q; R% p& G" w9 n4 d- //在event.data消息数据' E. p' Q4 a5 F" I3 k
- 7 ^ V1 K9 l) r# B
- }3 S5 J9 z3 p- R
+ j9 k9 i) D Y5 z+ i- socket.onclose = function(){: n0 Q1 k' v, r# G: D: }: `
4 o0 ]* c, [9 E4 Z; @$ P- //关闭WebSocket3 e3 G9 N- e0 J7 y5 m
q3 t6 z& g" B( i5 ~( Z8 M- }% {- G& ^) K3 z( i, P" F
. c2 T ^# b* b8 L* F' k- socket.onerror = function(){
3 d0 z6 i! l- a8 Z/ t; s
$ |+ [+ ^; z- {7 y- //错误触发
1 y8 D/ G3 j8 K0 D& } - ) y) u' J; I' C% t" i( R8 ]
- }
复制代码
; W- \1 D5 Y, H# Y6 s5 u( \通过套接口发送数据,调用socket.send: - <font color="rgb(79, 79, 79)">socket</font>.<font color="rgb(79, 79, 79)">send</font>(message)
复制代码
# c( V' q2 V& X" h* q, ^/ I8 l- W/ ~" p' }
代码附上: - <!DOCTYPE html>
/ G& _$ l& o O+ l" r9 G - <html>/ B; e# Q% e, l9 }+ h Q' {
! E# L) _+ T1 T- <head>
7 P' ~" F( E. b4 c9 t - <meta charset="UTF-8">
3 {# i* n: M4 @! u/ D - <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">% f4 |. B. Y0 K# ]+ x* O5 `0 a% d
- <title>WebSocket</title>; e' s7 D; Y% l' f
- </head>5 ]( S$ W4 p! H6 U" w: N) _# `
- 2 O& Y( Q, ]( V0 L8 w
- <body>! I9 Z; a7 f* s. N! ?
- </body>
3 W+ `% i, x) m& m! N* ~, p - <script>
6 o/ Z: W) \1 B - var socket;
8 ^) M5 x# b: @$ b - if (window.WebSocket) {$ m* w) F$ U4 R
- socket = new WebSocket("ws://localhost:8080/myapp");
8 _. [9 K+ D. R* l, [* W4 A4 d2 j; m; y - socket.onmessage = function(event) {) ~3 U0 `( w' f& O E$ U. j8 L* P
- alert("Received data from websocket: " + event.data);
3 h% [* \( C; ~ w( ]2 O7 ?; q - }
- V2 b3 O8 |9 O4 D - socket.onopen = function(event) {
6 {: Q A$ }2 @( _; U - alert("Web Socket opened!");
& L+ o+ z% R8 P$ M) O - };
& C1 v, E3 ` N3 I) ~4 [9 ^ - socket.onclose = function(event) {
$ }0 k% y' [7 U& M L2 J - alert("Web Socket closed.");
+ X( J8 r' |" V% }1 P/ o - };7 b+ d) |/ p% J( N
- } else {
: X# h7 z& B$ O9 P0 C1 ]2 @ - alert("Your browser does not support Websockets. (Use Chrome)");8 g7 F% V/ n; m4 T& I+ w% ^. h* _
- }
9 {0 u9 G1 c2 j- o
! g( a( u6 ?4 \ t. g( Q- function send(message) {
1 s+ W9 R* j- g( J' J. e$ { - if (!window.WebSocket) {
8 L4 T# E9 K" W$ |5 m - return;. _, P3 i# I2 n2 m
- }
! m; t- `8 e' O! I1 C1 r - if (socket.readyState == WebSocket.OPEN) {
1 Y9 m9 o- y+ | - socket.send(message);4 @9 e4 l; {5 f- o
- } else {
- ?$ a( t( i( w7 k) `0 j$ j. ^( U - alert("The socket is not open.");
/ r0 Y! E# @/ t4 A - }
$ p6 }2 u: z) y- S: I - }8 g9 M, K) S X$ B
- </script>, p1 E6 S8 J0 d6 B- x; g
. {/ [. w$ [5 s( @; C- </html>
复制代码
1 I: I$ f0 _1 ]7 P
+ K6 \* Y% ^4 f |