|
如果你要有一个支持 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>);
复制代码
8 k& d3 t0 Q) J! M. G& x; G' n) e: w与http://这一URL 前缀等价的WebSocket 前缀 是 ws:// ,安全 WebSocket 则有一个与http://等价的 wss:// 前缀。 1 X$ m/ d& b( r. y- M8 r
: ]0 L: @2 Q. o. f6 {2 Z4 t, q' w( _( z8 K* |$ o8 P- d+ E
该套接口对象有四个用来监听套接口事件的回调: - socket.onopen = function(){
9 `/ y( N7 m3 ?1 H+ L4 P: s! l; C
0 q' ]8 i, z n( k& o; b7 u- //打开2 o# {5 e8 |2 P/ ~
- 4 F7 M8 e/ Q0 E7 {/ M3 I
- }
5 o; A6 y0 Z4 x5 r9 ]9 T# U; o - * h1 B" z G$ L: ]5 A
) A4 n2 J/ a% s9 K, n! p! h- socket.onmessage = function(){
% w! Z- O* i- [- u
; e5 F0 D1 M" B- //在event.data消息数据
- T3 [, u- W5 d# _* W
7 Y* H( q* y; X Z1 J0 C- }
+ O- T7 e i$ C: x! U5 U - 6 [- {0 o/ `# e/ x. Q
- socket.onclose = function(){
5 m& V0 \. H9 B- ^8 T/ l
& m4 u# I+ y/ n$ k! n I- //关闭WebSocket3 Q; h$ e7 k$ {; @4 p) i( G
0 p0 k5 t- ], k e. {- }
/ P+ k: k8 B3 M2 N! N6 u. |4 u0 G% l
3 i; P3 Q5 Y! V- [5 w# l- socket.onerror = function(){
3 z6 D% j! I( t2 I5 J# \- W - 3 B# d2 h2 v! Z( Q' p5 Y: P4 o: j4 y
- //错误触发
; k4 b. Y- S; q0 S$ s - / ?5 ]. T" p8 Y7 v. z& S8 D
- }
复制代码 0 `2 i2 \) l4 p
通过套接口发送数据,调用socket.send: - <font color="rgb(79, 79, 79)">socket</font>.<font color="rgb(79, 79, 79)">send</font>(message)
复制代码 a( P; D5 I8 Z+ g4 }8 J
. ]9 a8 |: g! q5 s& e0 x S& y代码附上: - <!DOCTYPE html>
( I3 F, T( ]0 D8 ~ - <html>
# p- A x" {, K' p2 O2 R! ^0 h; V
' }- V; h* ?" b. K2 f5 y- <head>) r$ v0 m8 E$ ]1 a* u' K
- <meta charset="UTF-8">
* W, H# ~& t$ \( h. }6 f - <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
8 e& J1 R/ K# L& ?. ] - <title>WebSocket</title>
6 r1 h, H0 }. V2 |8 u - </head>
( O6 C6 h; d; Z9 w6 C: z7 I3 ~ - 9 x" S2 U- E$ t& v% P/ U6 i
- <body>9 Y: u# T# P+ e9 y/ q" G y
- </body>
; B( P# W$ K" f+ s" g6 { H6 f - <script>( Y! p7 c7 ^: O9 g3 a* |
- var socket;
0 ~5 Q- I8 U1 R" j8 N. y - if (window.WebSocket) {
8 {# e/ H" Z8 V0 S6 o' v. C& W - socket = new WebSocket("ws://localhost:8080/myapp");1 a! N6 D# P3 d3 m
- socket.onmessage = function(event) {
. ?3 ~: E; a+ O5 W - alert("Received data from websocket: " + event.data);) Q% i, y V( R1 g' t' v
- }
( ~1 `% K d E* V( ? - socket.onopen = function(event) {- J; E2 X n( x5 U- ~% x# M0 n
- alert("Web Socket opened!");
( D# C% i) P0 T3 e4 ~ - };& v) m. L7 h% A4 m2 I6 o* c
- socket.onclose = function(event) {
" x- e+ h' V7 F7 q2 ]- A. v - alert("Web Socket closed.");2 x5 N8 i! d/ e% ~& _
- };
2 u) y2 N3 A2 l$ Z( ^( W - } else {
* {7 Q3 `* C \/ s0 q2 \; O( K - alert("Your browser does not support Websockets. (Use Chrome)");, q7 O. |5 V( _/ }
- }
0 O9 ?4 M: w5 e+ e: o! n
' L W1 D9 G( p$ f- function send(message) {' }9 x! _0 B& U, G9 E
- if (!window.WebSocket) {
$ K6 [' H0 i0 M& q8 m. `3 K- X4 {* ~ - return;! S- F' F. ` u. `2 V' u
- }! {; u- x7 e) j- A: s8 y! c" O
- if (socket.readyState == WebSocket.OPEN) {
; d9 r8 |0 ]1 i: E8 j - socket.send(message);5 A6 ` }$ O O* B$ l* R
- } else {
6 A) {3 t) ?- {) _4 }& b1 T - alert("The socket is not open.");+ i2 d# F% c3 G3 Z! Q! M
- }
* s7 S* D9 ?) p$ J: @ - }
: e8 g' w0 h0 E2 T. h - </script>
% P; S- m+ O. l: @: N. y1 I - ( ~* I6 n0 U3 H+ t# V: M
- </html>
复制代码 & o" i- X. O: X1 ]1 G( m. F
* R) F x$ q* U9 I/ Y
|