|
如果你要有一个支持 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>);
复制代码
; x' E7 N9 A. S1 q! _+ D0 A与http://这一URL 前缀等价的WebSocket 前缀 是 ws:// ,安全 WebSocket 则有一个与http://等价的 wss:// 前缀。 ( P8 i9 `/ I m, ~7 q p# m
& ` B1 L% `0 h8 Y. L9 a9 v Z5 K# B
" q* M9 R5 z6 D4 R+ F4 }+ h3 J该套接口对象有四个用来监听套接口事件的回调: - socket.onopen = function(){2 q# k3 W! P ?1 b3 t, K
- 0 s7 s* [% J$ M z! W* V& T$ U
- //打开
& ~% D# s; j8 M
( V/ @3 s( z* s5 U8 U. s, G: n; b# A- }, H6 s. ]2 X, E$ `. ?
- . T; B4 \0 u" r# q- v. w$ D
- f; E8 j3 G% j, E9 _; \2 }+ ` d. y& G
- socket.onmessage = function(){
9 R) \5 C) s4 H! r3 s: J0 W2 p - 6 X7 F" q- \7 j! f: n& _3 u& D5 p
- //在event.data消息数据* U& Z1 A4 r' Q6 G3 i
3 b8 v8 f" r% f! M$ ^) A' O; `- }! d/ i' z8 O; h- j$ n
- # n a! ?8 X$ T) A- L, H/ _
- socket.onclose = function(){
8 m A( w4 |% J- L - 2 U$ J5 s X M3 x
- //关闭WebSocket2 X. c8 v4 c9 ^/ d4 z+ c% v; p
- 3 r; U0 L/ Q. O8 z' r" c
- }
. `; _/ U' k) ^3 X: ~; ~' I7 H
4 t( Y/ d! Q- k- R. ~4 D; h- socket.onerror = function(){
8 R7 f. m% C `2 [+ ?% N& n/ T
) m' o# e/ Q* v4 G4 C0 `, @- //错误触发5 |/ V: T+ y- G1 C3 E
) N' u! Q, }' S, ^- }
复制代码
! d* L* T" X( L. _! J通过套接口发送数据,调用socket.send: - <font color="rgb(79, 79, 79)">socket</font>.<font color="rgb(79, 79, 79)">send</font>(message)
复制代码 2 y. h9 _9 B) H: O4 G4 N
/ A4 p8 P$ y& q. }% v3 p) B代码附上: - <!DOCTYPE html>5 Y5 k7 z2 W1 d& \% j# G# s8 n
- <html>1 S% ^- E& B, q; _
5 }9 V% Q$ I$ y7 N# D- <head>) T) D# F/ x/ B/ z( [
- <meta charset="UTF-8">
" W) y, E! ?7 ~ N% O, | - <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport"># {' ` ^2 |6 S2 W9 u; d% N
- <title>WebSocket</title>2 e2 ^" R1 Q, [. e- @
- </head>
# I; p8 d- a* @9 R
9 O( [' O3 ^3 C8 x% W+ h- <body>
- Z8 M0 P# p3 y- @# i - </body>6 S) N$ f* F3 M/ |2 @; Z
- <script>, V. X$ [7 Y3 f; n
- var socket;" U7 R4 Z! n- i/ Z
- if (window.WebSocket) {
5 k% h! s) {# X - socket = new WebSocket("ws://localhost:8080/myapp");
% Q- G1 N) `& E! V% H; M - socket.onmessage = function(event) {: Z. w. X' |5 s5 ^5 U
- alert("Received data from websocket: " + event.data);" ]$ P3 C7 |; @
- }
9 Z) }' |: K! F! c - socket.onopen = function(event) {9 E# t5 {% ~/ K) m! l
- alert("Web Socket opened!");6 c7 T" I6 y/ H+ P! C( K7 b
- };
* B" s& G7 o, o/ X8 F$ W - socket.onclose = function(event) {
. K/ ?$ t( D |0 i- |* D - alert("Web Socket closed.");
0 |+ K+ D q: R2 N1 A7 L, ]$ [ Y - };& `# i# A/ p x% N/ M5 K) F
- } else {* ]+ u. Z. a/ a2 G) W) Q5 @
- alert("Your browser does not support Websockets. (Use Chrome)");
) p, M" u3 H0 N. b1 Y" D, P4 H& \ - }, N' Y' S! ^( q
- ; j+ h( h; z! W, t) @- f
- function send(message) {0 ^. R5 r# q; L! I- @7 a4 r
- if (!window.WebSocket) {7 h3 h- n+ F* U8 g& y* h
- return;
- R* l2 `3 W) _0 w - }0 q! o- x7 W4 W: X! q) J3 P+ [
- if (socket.readyState == WebSocket.OPEN) {
" u5 c+ |+ w/ y. c9 w - socket.send(message);0 i; M# j& d. W4 V+ D
- } else {* |, G( J8 k* [4 O
- alert("The socket is not open.");4 V4 L8 F4 \1 A
- }
' ?3 W" Q7 \% t. y6 K - }
+ N7 T d, o5 ` - </script>! Q B9 g" H, f& P7 e+ n; b+ f% f2 z
- 6 l) @! a$ W4 H8 s% V
- </html>
复制代码
( c1 w. G" e3 i2 o2 N3 \4 H+ F( E& R1 C) r7 ^3 O. T3 k
|