|
如果你要有一个支持 WebSocket的服务器(Java、Php等),可以在浏览器中使用一个新的WebSocket服务协议,来打开一个链接: - var socket = new WebSocket("ws://172.0.0.1:8080/SpringWebSocketPush/websck");
复制代码
3 C# Y9 N' y, S& |+ K# [7 h与http://这一URL 前缀等价的WebSocket 前缀 是 ws:// ,安全 WebSocket 则有一个与http://等价的 wss:// 前缀。
4 Y$ f/ g! \6 `- U" n$ d. K9 d/ P5 N+ J: P7 Y1 G. g
5 U- x7 r' j% S2 H1 R2 f& D该套接口对象有四个用来监听套接口事件的回调: - socket.onopen = function(){ //打开
- G0 V& i3 y4 |( t7 u - }/ d. q' |1 P$ J) W6 L4 ]
' o& _$ y) U0 O' s, N- o( j: ?- socket.onmessage = function(){
6 I: {4 Q5 U0 M* w$ O8 j6 V - //在event.data消息数据
5 c3 R7 \: d7 K7 |- }0 M8 F" H9 d - }. |9 P: z. A- R( P2 J) c
- # Q$ x7 e9 j; t
- socket.onclose = function(){2 R& a; q4 d; o) S( q
- //关闭WebSocket& P7 F9 E5 X- k/ N+ B
- }5 s9 g9 J- w. _% v1 W, U9 L8 @
5 j [" [, ?3 r, G( v- socket.onerror = function(){' s% ?! q2 @$ m- _9 w! R0 m7 c2 F
- //错误触发
6 H4 Y) |$ O( G: u; p8 a i - }
复制代码 0 n! }4 E8 \6 E: q- f" I
; _# a5 [8 D$ r6 t
通过套接口发送数据,调用socket.send: 4 j; b4 F* S0 O, N/ R' p& M S" {
# A7 f0 Q" ^' w* B# N
2 R* ^ z( Y. J& v& {1 [
代码附上: - <!DOCTYPE html><html> ]1 }5 K2 j" K2 \7 r
- <head>: B: K" a* `$ u/ C. g
- <meta charset="UTF-8">" G5 f7 y' B* s/ W
- <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">' ~0 P, r6 D c- [1 `
- <title>WebSocket</title>
8 }3 T* M: R6 H( U - </head>
$ ]7 @; R2 u W - <body>
1 W( n% p1 e; h3 r - </body>, L+ p. |' j, A/ @) z
- <script>
6 [7 C6 Z6 {5 v# N+ R* b - var socket;
& i6 P( Y) k( A% Q* { - if (window.WebSocket) { u3 C# U! D( L# Y. d, \! P
- socket = new WebSocket("ws://localhost:8080/myapp");* x2 w( [- \/ F. g: M+ q
- socket.onmessage = function(event) {
/ L. }- Y4 @- D - alert("Received data from websocket: " + event.data);
; w% u- T; _& o9 j/ f% V - }
# t: {, F/ a/ g2 y7 ~) T - socket.onopen = function(event) {
2 R; j5 k+ b6 q* S$ a - alert("Web Socket opened!");
' N+ `6 X6 o, d' \* B! Y - };
, \0 f3 ?6 f5 H$ e - socket.onclose = function(event) {
c4 D' C. X& t' K% p6 v - alert("Web Socket closed.");
( B$ W4 e ]. a7 T* V - };3 c1 Q: N3 E z
- } else {
; ]0 x0 l8 K4 L, V7 W7 H- d7 f - alert("Your browser does not support Websockets. (Use Chrome)");
2 \% H& v6 {( o! `9 [ - }& `; M, Z G3 w1 s, o7 M8 s
) h; `. ^" v( V! Z7 S: ?- function send(message) {
4 D; F$ x4 @, Y" T/ W* J/ M2 a - if (!window.WebSocket) {
1 Q, M9 @3 w" V5 ?1 o/ s. K - return;* y2 X* ~9 ~- M K" A1 V) s
- }
1 p$ Y9 A# \; p4 P1 v8 I% } - if (socket.readyState == WebSocket.OPEN) {
) Y+ W7 m1 ]0 o; n1 Z$ y - socket.send(message);
6 t) H9 t+ }2 f4 D! K) g - } else {8 ^6 S8 |. X; i1 j* N$ _
- alert("The socket is not open.");! T6 _ @1 N. [; y, O5 h/ e: ]
- }7 F6 J3 _4 x! f
- }
( o w7 Q/ j5 Z - </script>
4 q9 X' [- Y1 E3 ?9 z. w& b& w - </html>
复制代码 9 C. [3 x& b" T* A
' S* p" P9 W4 X' t( U9 K- T2 T0 k$ c/ m" Y$ i) L# A+ J4 h j
|