您尚未登录,请登录后浏览更多内容! 登录 | 立即注册

QQ登录

只需一步,快速开始

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 15281|回复: 0
打印 上一主题 下一主题

[php学习资料] 浏览器使用WebSocket实时通讯

[复制链接]
跳转到指定楼层
楼主
发表于 2018-6-23 19:36:00 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

如果你要有一个支持 WebSocket的服务器(Java、Php等),可以在浏览器中使用一个新的WebSocket服务协议,来打开一个链接:

  1. var socket = new WebSocket("ws://172.0.0.1:8080/SpringWebSocketPush/websck");  
复制代码
/ A0 g! r) [5 U( Y( F, x

与http://这一URL 前缀等价的WebSocket 前缀 是 ws:// ,安全 WebSocket 则有一个与http://等价的 wss:// 前缀。
- _' k) I% ^7 F8 I; A% m& u# c, Q8 _( |; ?$ S' y1 }5 J

2 l3 p, X* U  S# f" ?该套接口对象有四个用来监听套接口事件的回调:

  1.     socket.onopen = function(){        //打开
    , |' s, a+ ~; f
  2.     }" ?, m7 [; P4 t! s* y# G1 V1 w
  3. # P) B8 g8 c9 [4 ]) G4 Z- c8 e, _
  4.     socket.onmessage = function(){
    - a. T7 o$ i8 c2 n) S
  5.         //在event.data消息数据
    7 a# p# h* ]$ q3 R  R* [+ p5 [
  6.     }
    * l( A# V" l# h. N" ?! T7 F

  7. ' H; S( A3 U& y3 R3 u
  8.     socket.onclose = function(){2 m9 k; g9 A4 i
  9.         //关闭WebSocket  h3 r5 x6 ?: l
  10.     }: E# o8 m5 ], E: G! Z

  11. & U  C  s9 L. U: H
  12.     socket.onerror = function(){3 Z! w9 A5 j% C% M/ ]6 _
  13.         //错误触发
    + X0 Q* x. i  L% a
  14.     }
复制代码

+ K, r) t! v1 p$ }( @
- \$ J  N) N* h+ T- ?- D& x

通过套接口发送数据,调用socket.send:

  1.     socket.send(message)
复制代码
9 ~) e: @0 [" f. x
( p- }1 }9 m% m, h' m3 ?% s

! F. U$ j; U4 N# `2 P6 y

代码附上:

  1. <!DOCTYPE html><html>
    / G4 ?  G4 d) c$ ]5 G
  2.     <head>
    " ]* Y" I" q+ B4 z2 g- ?
  3.         <meta charset="UTF-8">
    * E7 |5 N" n. h8 b3 L: {% g
  4.         <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
    " U# s8 c: F- E% c5 Q8 O1 J
  5.         <title>WebSocket</title>% _, q9 I3 @  R. }& [  ^
  6.     </head>
    ' K, m/ \. |9 t1 {% x
  7.     <body>
    8 k" N* W1 k9 f2 y* [
  8.     </body>8 S4 w( r$ D  m0 T% q( C: g
  9.     <script>8 _# ]$ a6 \2 j; U5 {' j
  10.         var socket;( F5 ?3 l. f& _* K& ]
  11.         if (window.WebSocket) {
    ) f) X& ^& X, X$ X% J0 M
  12.             socket = new WebSocket("ws://localhost:8080/myapp");
    ; R- V& m5 _0 G& l: k
  13.             socket.onmessage = function(event) {
    ; B. ^  `: \" X# k4 P: D; n
  14.                 alert("Received data from websocket: " + event.data);
    & D  A, @/ ]2 c4 q/ K0 O9 V
  15.             }' u  S& `$ U2 ~" ^* r
  16.             socket.onopen = function(event) {
    + n) ]& b: b2 I0 \
  17.                 alert("Web Socket opened!");
    ( w) ^0 u" Y+ S1 Q8 e. {4 B9 g% }
  18.             };
    8 n. z& x* @. F5 Q+ f' k
  19.             socket.onclose = function(event) {# x( e$ N# x, j) I! G% q
  20.                 alert("Web Socket closed.");
    - R* y( g. _- @7 O  m6 r  H3 V
  21.             };
    - w/ d+ f3 _2 ^: {+ j& q- |
  22.         } else {/ h, G, z0 l& r- @
  23.             alert("Your browser does not support Websockets. (Use Chrome)");
    5 B5 d% D5 l0 g6 s$ X8 s, E
  24.         }9 c9 n* {1 f# D# Y% ~- G
  25. $ }' Y0 ?# e/ A
  26.         function send(message) {
    / y9 K3 N' `, _7 C" W( A
  27.             if (!window.WebSocket) {5 i, Z  a; C  Q! }% ]# g5 p$ q
  28.                 return;  \- V( ?" ?- D; c
  29.             }
    - ^. S+ G* D" K
  30.             if (socket.readyState == WebSocket.OPEN) {$ m; Q( a2 h- f# n3 F7 Q
  31.                 socket.send(message);
    3 M0 U7 M- Z, Q; I8 ~- f3 e+ Q. d
  32.             } else {
    ! ]+ A) w4 z4 ]
  33.                 alert("The socket is not open.");
    , Q3 i6 Z2 `* ]7 z
  34.             }
    4 C( m. Y8 }/ P1 d5 F
  35.         }4 j! I4 B) b$ U/ ^9 b
  36.     </script>
    # n0 `5 {0 o3 ]- i0 [9 H
  37. </html>
复制代码

. q/ d  n( R, T6 k% V) O
7 G/ Y( E# ^) t; Y( c2 y0 q5 I, Z0 g4 R6 E2 o, f! g
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 支持支持 反对反对
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

GMT+8, 2026-8-4 13:38 , Processed in 0.066586 second(s), 19 queries .

Copyright © 2001-2026 Powered by cncml! X3.2. Theme By cncml!