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

QQ登录

只需一步,快速开始

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 14348|回复: 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");  
复制代码

" M" C  U0 Y  r% d/ t, D

与http://这一URL 前缀等价的WebSocket 前缀 是 ws:// ,安全 WebSocket 则有一个与http://等价的 wss:// 前缀。
1 \( I0 v. Y! K9 q% Z8 N) A: k" @9 j; F& p1 t, K

0 S! n* {* v; q) H: p  M该套接口对象有四个用来监听套接口事件的回调:

  1.     socket.onopen = function(){        //打开
    6 m' B9 S5 `! @/ N% q* Z; V
  2.     }5 ~, X# W% j, i% B+ Z+ ^  ?( I/ o
  3. ) A$ u: K/ A( B- k$ E4 m
  4.     socket.onmessage = function(){5 ^" [8 z- o  E; X' @* ?" r" H  ]( a
  5.         //在event.data消息数据
    4 S) `/ V  b! B9 q$ p
  6.     }
    6 S( d# w; X6 l* h2 A" t+ v. Q
  7. & M1 B: P, z& e
  8.     socket.onclose = function(){& S# e$ V2 a7 e7 ^9 y
  9.         //关闭WebSocket
    1 x7 V2 q7 T) w, Y; f% Y
  10.     }
    . S7 m* l1 [# O' [; _! b- @

  11.   a5 ]7 A' z, O- Y* L- X! L+ }5 U
  12.     socket.onerror = function(){
    / T, b, V7 T" Q; O6 l  V5 W
  13.         //错误触发4 _+ r' w6 D6 ^& s, ^
  14.     }
复制代码

0 T- z6 Z' ^8 T' e6 u! ^% s  ?4 S7 B' t: N) g4 B

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

  1.     socket.send(message)
复制代码
2 f5 A( j9 w* b9 D2 L8 j7 l
1 T* Y0 i1 {+ c$ `
0 p& X: a2 ?0 F$ V

代码附上:

  1. <!DOCTYPE html><html>2 S! i0 W3 }/ W# [
  2.     <head>8 W- `$ g; q- X9 h
  3.         <meta charset="UTF-8">
    # W4 e: @: w  `- t0 {3 a
  4.         <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
    # j$ t  Y/ D! K1 C) \
  5.         <title>WebSocket</title>
    ( W- e$ R+ G6 o7 O, w; s
  6.     </head>
    3 Q% J% K1 W. F$ ]( z
  7.     <body>, ?$ a# r2 `# K0 o* \2 q- j
  8.     </body>
    ! T2 n) O2 E, p, [$ I! `; f8 ^. k
  9.     <script>
    ' R7 i2 d0 u% l$ ~& D4 B  K
  10.         var socket;8 w" @4 D, x( S
  11.         if (window.WebSocket) {" q: G8 B  c# B5 S8 j5 V
  12.             socket = new WebSocket("ws://localhost:8080/myapp");
    * ^* `  }! F- `9 ?/ ^
  13.             socket.onmessage = function(event) {
    / {' @3 U% v' j5 N
  14.                 alert("Received data from websocket: " + event.data);
    + s; m- d1 h4 j2 }1 Y
  15.             }
      k9 d1 z4 B7 X+ }8 X
  16.             socket.onopen = function(event) {" _% O, G5 v. A3 L. Y4 ?* c
  17.                 alert("Web Socket opened!");
    & d: D8 o! d% E; c  F
  18.             };/ q5 u7 K) A/ V* U* E9 g/ M% N
  19.             socket.onclose = function(event) {5 C+ R& U4 K& i2 F
  20.                 alert("Web Socket closed.");
    % U- j1 G6 j' a& u: F
  21.             };+ `+ _2 o+ j+ N! \1 q) S
  22.         } else {& p7 \& R8 o9 h5 x" ~
  23.             alert("Your browser does not support Websockets. (Use Chrome)");
    1 k" D$ @1 K$ Z5 Z. s  H
  24.         }" ?1 G7 J1 H- e, A8 B2 ?& u" N

  25. : b" f# d/ ]: G* |
  26.         function send(message) {. R/ M. w9 C% t
  27.             if (!window.WebSocket) {/ z* y  j( Q8 d. |9 X; N( i
  28.                 return;& G* i) [( U! h" E+ c' X  i
  29.             }
    # E: w. w- D7 M( J$ @" v( w/ E
  30.             if (socket.readyState == WebSocket.OPEN) {
    3 k/ e7 `6 i- \1 T" Q
  31.                 socket.send(message);
    ) u- R0 q# ~3 n3 G" k7 u& i9 x0 @
  32.             } else {' S0 E/ o$ _! I. d
  33.                 alert("The socket is not open.");* E+ h! S: A' i" ~8 k$ ]
  34.             }
    9 X7 }: w0 U: G
  35.         }
    / u1 Z( ?1 |* i  G, v! d
  36.     </script>- S2 W. d' c, `7 X
  37. </html>
复制代码

' p/ K' c& d3 H" {+ ]6 \' p  V( ^# Z0 K0 v$ P
# X$ Z3 c8 P  C! |5 P; N
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 支持支持 反对反对
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

GMT+8, 2026-1-30 15:05 , Processed in 0.056726 second(s), 19 queries .

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