search
HomeBackend DevelopmentPHP TutorialDetailed explanation of how to use websocket in PHP

关于PHP中websocket使用的详细注解,供大家参考。

服务端: 

<?php
//send用户加入
//send1发送信息
//send2退出登录
 
error_reporting(E_ALL ^ E_NOTICE);
ob_implicit_flush();
//file_put_contents(&#39;lz.text&#39;,&#39;123&#39;, FILE_APPEND);
$sk=new Sock(&#39;127.0.0.1&#39;,8000);
$sk->run();
class Sock{
 public $sockets;
 public $users;
 public $master;
  
 private $sda=array();//已接收的数据
 private $slen=array();//数据总长度
 private $sjen=array();//接收数据的长度
 private $ar=array();//加密key
 private $n=array();
  
 public function __construct($address, $port){ 
 $this->master=$this->WebSocket($address, $port);//resource(2, Socket)  //服务器监听
 var_dump("master:");
 var_dump($this->master);
 $this->sockets=array($this->master);//array (size=1) 0 => resource(2, Socket) 。运行两个php还是这样
 //var_dump($this->sockets);
 //file_put_contents(&#39;lz.text&#39;,var_dump($this->sockets), FILE_APPEND);
 }
  
  
 function run(){
 while(true){
  $changes=$this->sockets;//$changes由多变1,但$this->sockets却只是稳定的+1;
   
  $write=NULL;
  $except=NULL;
  //1.运行select()系统调用在给定阵列插座与指定的超时
  //2.没有接收到数据就会一直处于阻塞状态,
  //3.若没有client过来,直阻塞进程,直到有client访问,返回1。
  //4.此时返回的changes,不是曾经的changes。虽然还只是一条记录,但已经不是服务器而是客户端
   
   /*select的特殊作用:!!!!!!!
  初始为array(0=>resource(2, Socket))
  1,初始状态返回为array(0=>resource(2, Socket))。但socket_accept可以得到resource(3, Socket)
  2,初始状态返回为array(0=>resource(2, Socket),1=>resource(3,Socket))。
   客户来的客户为resource(3,Socket)。则返回的数据为resource(3,Socket).!!!
   
  */
  var_dump($changes);
  $rr=socket_select($changes,$write,$except,NULL);
  var_dump($changes);
  var_dump("---*---");
  //exit;
  /*
  file_put_contents(&#39;lz.text&#39;,json_encode($changes), FILE_APPEND);
  file_put_contents(&#39;lz.text&#39;,&#39;-----&#39;, FILE_APPEND);*/
   
  foreach($changes as $sock){
  //连接主机的client
   
  //$this->master永远是 resource(2, Socket)。相当于一个缓存。两种情况,1:为空,使进程阻塞。2:存刚接收的client。
  if($sock==$this->master){ //---此处只用来存数据了
//在socket套接字已创建使用socket_create(),必将与socket_bind()名字,告诉听连接socket_listen(),这个函数将接受传入的连接,插座。
//一旦成功连接,将返回一个!!新的套接字资源!!,该资源可用于通信。如果套接字上有多个连接,则第一个将被使用。
//如果没有挂起的连接,socket_accept()将阻塞直到连接成为现在。如果使用了非阻塞套接字已socket_set_blocking()或socket_set_nonblock(),错误将返回。
//返回socket_accept()插座资源不得用于接受新的连接。原来的听插座插座,但是,仍然是开放的,可以重复使用。 
   $client=socket_accept($this->master); //resource(3, Socket)。表示接受请求,并创建一个子链接!!
    //var_dump($client);
   //exit;
   $key=uniqid();
   $this->sockets[]=$client;
   $this->users[$key]=array(  
   &#39;socket&#39;=>$client,
   &#39;shou&#39;=>false
   );
   /*
   array (size=1)
    &#39;57d607085f92a&#39; =>  //$key
   array (size=2)
    &#39;socket&#39; => resource(3, Socket) //$socket的表现都一样,只有通过$key区分
    &#39;shou&#39; => boolean false
    */
    
    
  // file_put_contents(&#39;lz.text&#39;,json_encode($this->users), FILE_APPEND);
  }else{ //---此处服务器与客户端发信息
   $len=0; 
   $buffer=&#39;&#39;;
   do{
   /*    
   int socket_recv ( resource socket, string &buf, int len, int flags )
   resource socket 是生成的套接字
   string &buf 是接收缓冲区
   int len 是你打算接收的长度
   int flags 是一个标志
   0x1 数据应该带外发送,所谓带外数据就是TCP紧急数据
   0x2 使有用的数据复制到缓冲区内,但并不从系统缓冲区内删除。
   0x4 不要将包路由出去。
   以上三项与sock.h文件中定义完全相同
   0x8 数据完整记录
   0x100 数据完整处理
   */
   $l=socket_recv($sock,$buf,1000,0);//原来取数据是一个缓慢的过程,要一次一次取数据,并计算每次buf的长度,让总长度不超过设定值
   //var_dump($l);
   // exit;
  // file_put_contents(&#39;lz.text&#39;,&#39;socket_recv&#39;, FILE_APPEND);
   $len+=$l;
   $buffer.=$buf;
   }while($l==1000);
   $k=$this->search($sock);//跟据sock返回key值
   if($len<7){ //发过来的消息太短了,系统就判断 断了,断掉链接。
   $this->send2($k);//用户退出。1关闭这个$key值对应的socket、删除这条key记录。将sockets数组对象重新排列。
                 //2
   continue;
   }
   if(!$this->users[$k][&#39;shou&#39;]){//判断用户的握手字段是true?否则重新握手。
   $this->woshou($k,$buffer);
   //file_put_contents(&#39;lz.text&#39;,&#39;woshou&#39;, FILE_APPEND);
   }else{ //如果用户已经握手,则与用户之间进行通信。终于可以发消息了!
   $buffer = $this->uncode($buffer,$k); //返编译
    
   if($buffer==false){
    continue;
   }
   //var_dump($bufffer);
   //exit;
   $this->send($k,$buffer);
   }
  }
  }
   
 }
  
 }
  
 function close($k){
 socket_close($this->users[$k][&#39;socket&#39;]);
 unset($this->users[$k]);
 $this->sockets=array($this->master);
 foreach($this->users as $v){
  $this->sockets[]=$v[&#39;socket&#39;];
 }
 $this->e("key:$k close");
 }
  
 function search($sock){
 foreach ($this->users as $k=>$v){
  if($sock==$v[&#39;socket&#39;])
  return $k;
 }
 return false;
 }
  
 function WebSocket($address,$port){ //服务器监听
 //创建并返回一个套接字resource,也称作一个通讯节点。一个典型的网络连接由 2 个套接字构成,一个运行在客户端,另一个运行在服务器端。 
 //协议,类型,具体协议
 $server = socket_create(AF_INET, SOCK_STREAM, SOL_TCP); //resource(2, Socket)
 //file_put_contents(&#39;lz.text&#39;,$server, FILE_APPEND);//supplied resource is not a valid stream resource
    //返回bool.套接字resource,协议级别,可用的socket选项,值。
 $r=socket_set_option($server, SOL_SOCKET, SO_REUSEADDR, 1);//boolean true
  
 //绑定 address 到 socket。 该操作必须是在使用 socket_connect() 或者 socket_listen() 建立一个连接之前。 
 $r2=socket_bind($server, $address, $port);//boolean true
 
 
 //在socket套接字已创建使用socket_create()定界与socket_bind()名称,它可以告诉听套接字传入的连接.
 $r3=socket_listen($server);//boolean true
 
 $this->e(&#39;Server Started : &#39;.date(&#39;Y-m-d H:i:s&#39;));
 $this->e(&#39;Listening on  : &#39;.$address.&#39; port &#39;.$port);
 return $server;
 }
  
  
 function woshou($k,$buffer){
 //对接收到的buffer处理,并回馈握手!!
 $buf = substr($buffer,strpos($buffer,&#39;Sec-WebSocket-Key:&#39;)+18);
 $key = trim(substr($buf,0,strpos($buf,"\r\n")));
  
 $new_key = base64_encode(sha1($key."258EAFA5-E914-47DA-95CA-C5AB0DC85B11",true));
  
 $new_message = "HTTP/1.1 101 Switching Protocols\r\n";
 $new_message .= "Upgrade: websocket\r\n";
 $new_message .= "Sec-WebSocket-Version: 13\r\n";
 $new_message .= "Connection: Upgrade\r\n";
 $new_message .= "Sec-WebSocket-Accept: " . $new_key . "\r\n\r\n";
  
 socket_write($this->users[$k][&#39;socket&#39;],$new_message,strlen($new_message));//sokcet,buffer(缓冲区),长度
 $this->users[$k][&#39;shou&#39;]=true;
 return true;
  
 } 
  
 function uncode($str,$key){ //返编译
 $mask = array(); 
 $data = &#39;&#39;; 
 $msg = unpack(&#39;H*&#39;,$str);//unpack() 函数从二进制字符串对数据进行解包。
 $head = substr($msg[1],0,2); 
 if ($head == &#39;81&#39; && !isset($this->slen[$key])) { 
  $len=substr($msg[1],2,2);
  $len=hexdec($len);
  if(substr($msg[1],2,2)==&#39;fe&#39;){
  $len=substr($msg[1],4,4);
  $len=hexdec($len);//hexdec() 函数把十六进制转换为十进制。
  $msg[1]=substr($msg[1],4);
  }else if(substr($msg[1],2,2)==&#39;ff&#39;){
  $len=substr($msg[1],4,16);
  $len=hexdec($len);
  $msg[1]=substr($msg[1],16);
  }
  $mask[] = hexdec(substr($msg[1],4,2)); 
  $mask[] = hexdec(substr($msg[1],6,2)); 
  $mask[] = hexdec(substr($msg[1],8,2)); 
  $mask[] = hexdec(substr($msg[1],10,2));
  $s = 12;
  $n=0;
 }else if($this->slen[$key] > 0){
  $len=$this->slen[$key];
  $mask=$this->ar[$key];
  $n=$this->n[$key];
  $s = 0;
 }
  
 $e = strlen($msg[1])-2;
 for ($i=$s; $i<= $e; $i+= 2) { 
  $data .= chr($mask[$n%4]^hexdec(substr($msg[1],$i,2))); 
  $n++; 
 } 
 $dlen=strlen($data);
  
 if($len > 255 && $len > $dlen+intval($this->sjen[$key])){
  $this->ar[$key]=$mask;
  $this->slen[$key]=$len;
  $this->sjen[$key]=$dlen+intval($this->sjen[$key]);
  $this->sda[$key]=$this->sda[$key].$data;
  $this->n[$key]=$n;
  return false;
 }else{
  unset($this->ar[$key],$this->slen[$key],$this->sjen[$key],$this->n[$key]);
  $data=$this->sda[$key].$data;
  unset($this->sda[$key]);
  return $data;
 }
  
 }
  
  
 function code($msg){ //编译
 $frame = array(); 
 $frame[0] = &#39;81&#39;; 
 $len = strlen($msg);
 if($len < 126){
  $frame[1] = $len<16?&#39;0&#39;.dechex($len):dechex($len);
 }else if($len < 65025){
  $s=dechex($len);
  $frame[1]=&#39;7e&#39;.str_repeat(&#39;0&#39;,4-strlen($s)).$s;
 }else{
  $s=dechex($len);
  $frame[1]=&#39;7f&#39;.str_repeat(&#39;0&#39;,16-strlen($s)).$s;
 }
 $frame[2] = $this->ord_hex($msg); 
 $data = implode(&#39;&#39;,$frame); 
 return pack("H*", $data); 
 }
  
 function ord_hex($data) { 
 $msg = &#39;&#39;; 
 $l = strlen($data); 
 for ($i= 0; $i<$l; $i++) { 
  $msg .= dechex(ord($data{$i})); 
 } 
 return $msg; 
 }
  
  
 //用户加入
 function send($k,$msg){
 parse_str($msg,$g);//把查询字符串解析到变量中
 $ar=array();
 if($g[&#39;type&#39;]==&#39;add&#39;){
  $this->users[$k][&#39;name&#39;]=$g[&#39;ming&#39;];
  $ar[&#39;type&#39;]=&#39;add&#39;;
  $ar[&#39;name&#39;]=$g[&#39;ming&#39;];
  $key=&#39;all&#39;;
 }else{
  $ar[&#39;nrong&#39;]=$g[&#39;nr&#39;];
  $key=$g[&#39;key&#39;];
 }
 $this->send1($k,$ar,$key);
 }
  
 function getusers(){
 $ar=array();
 foreach($this->users as $k=>$v){
  $ar[]=array(&#39;code&#39;=>$k,&#39;name&#39;=>$v[&#39;name&#39;]);
 }
 return $ar;
 }
  
 //$k 发信息人的code $key接受人的 code
 function send1($k,$ar,$key=&#39;all&#39;){
 $ar[&#39;code1&#39;]=$key;
 $ar[&#39;code&#39;]=$k;
 $ar[&#39;time&#39;]=date(&#39;m-d H:i:s&#39;);
 $str = $this->code(json_encode($ar));
 if($key==&#39;all&#39;){
  $users=$this->users;
  if($ar[&#39;type&#39;]==&#39;add&#39;){
  $ar[&#39;type&#39;]=&#39;madd&#39;;
  $ar[&#39;users&#39;]=$this->getusers();
  $str1 = $this->code(json_encode($ar));
  socket_write($users[$k][&#39;socket&#39;],$str1,strlen($str1));//发送者
  unset($users[$k]);
  }
  foreach($users as $v){
  socket_write($v[&#39;socket&#39;],$str,strlen($str));//接收者
  }
 }else{
  socket_write($this->users[$k][&#39;socket&#39;],$str,strlen($str));//发送者
  socket_write($this->users[$key][&#39;socket&#39;],$str,strlen($str));//接收者
 }
 }
  
 //用户退出
 function send2($k){
 $this->close($k);
 $ar[&#39;type&#39;]=&#39;rmove&#39;;
 $ar[&#39;nrong&#39;]=$k;
 $this->send1(false,$ar,&#39;all&#39;);
 }
  
 function e($str){
 //$path=dirname(__FILE__).&#39;/log.txt&#39;;
 $str=$str."\n";
 //error_log($str,3,$path);
 echo iconv(&#39;utf-8&#39;,&#39;gbk//IGNORE&#39;,$str);
 }
}
?>

 客户端:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
<title>HTML5 websocket 网页聊天室 javascript php</title>
<style type="text/css">
body,p{margin:0px; padding:0px; font-size:14px; color:#333; font-family:Arial, Helvetica, sans-serif;}
#ltian,.rin{width:98%; margin:5px auto;}
#ltian{border:1px #ccc solid;overflow-y:auto; overflow-x:hidden; position:relative;}
#ct{margin-right:111px; height:100%;overflow-y:auto;overflow-x: hidden;}
#us{width:110px; overflow-y:auto; overflow-x:hidden; float:right; border-left:1px #ccc solid; height:100%; background-color:#F1F1F1;}
#us p{padding:3px 5px; color:#08C; line-height:20px; height:20px; cursor:pointer; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
#us p:hover,#us p:active,#us p.ck{background-color:#069; color:#FFF;}
#us p.my:hover,#us p.my:active,#us p.my{color:#333;background-color:transparent;}
button{float:right; width:80px; height:35px; font-size:18px;}
input{width:100%; height:30px; padding:2px; line-height:20px; outline:none; border:solid 1px #CCC;}
.rin p{margin-right:160px;}
.rin span{float:right; padding:6px 5px 0px 5px; position:relative;}
.rin span img{margin:0px 3px; cursor:pointer;}
.rin span form{position:absolute; width:25px; height:25px; overflow:hidden; opacity:0; top:5px; right:5px;}
.rin span input{width:180px; height:25px; margin-left:-160px; cursor:pointer}
 
#ct p{padding:5px; line-height:20px;}
#ct a{color:#069; cursor:pointer;}
#ct span{color:#999; margin-right:10px;}
.c2{color:#999;}
.c3{background-color:#DBE9EC; padding:5px;}
.qp{position:absolute; font-size:12px; color:#666; top:5px; right:130px; text-decoration:none; color:#069;}
#ems{position:absolute; z-index:5; display:none; top:0px; left:0px; max-width:230px; background-color:#F1F1F1; border:solid 1px #CCC; padding:5px;}
#ems img{width:44px; height:44px; border:solid 1px #FFF; cursor:pointer;}
#ems img:hover,#ems img:active{border-color:#A4B7E3;}
#ems a{color:#069; border-radius:2px; display:inline-block; margin:2px 5px; padding:1px 8px; text-decoration:none; background-color:#D5DFFD;}
#ems a:hover,#ems a:active,#ems a.ck{color:#FFF; background-color:#069;}
.tc{text-align:center; margin-top:5px;}
</style>
</head>
 
<body>
<div id="ltian">
 <div id="us" class="jb"></div>
 <div id="ct"></div>
  <a href="javascript:;" class="qp" onClick="this.parentNode.children[1].innerHTML=&#39;&#39;">清屏</a>
</div>
<div class="rin">
  <button id="sd">发送</button>
  <span><img  src="/static/imghwm/default1.png"  data-src="http://www.yxsss.com/ui/sk/t.png"  class="lazy"   title="表情" id="imgbq" alt="Detailed explanation of how to use websocket in PHP" ><img  src="/static/imghwm/default1.png"  data-src="http://www.yxsss.com/ui/sk/e.png"  class="lazy"   title="上传图片" alt="Detailed explanation of how to use websocket in PHP" ><form><input type="file" title="上传图片" id="upimg"></form></span>
  <p><input id="nrong"></p>
</div>
<div id="ems"><p></p><p class="tc"></p></div>
<script>
if(typeof(WebSocket)==&#39;undefined&#39;){
 alert(&#39;你的浏览器不支持 WebSocket ,推荐使用Google Chrome 或者 Mozilla Firefox&#39;); 
}
</script>
<script src="http://www.yxsss.com/ui/p/a.js" type="text/javascript"></script>
<script>
(function(){
 var key=&#39;all&#39;,mkey;
 var users={};
 var url=&#39;ws://127.0.0.1:8000&#39;;
 var so=false,n=false;
 var lus=A.$(&#39;us&#39;),lct=A.$(&#39;ct&#39;);
 function st(){
 n=prompt(&#39;请给自己取一个响亮的名字:&#39;);
 n=n.substr(0,16);
 if(!n){
  return ; 
 }
 so=new WebSocket(url);
 so.onopen=function(){
  if(so.readyState==1){
    alert(&#39;888&#39;);
  so.send(&#39;type=add&ming=&#39;+n);
  }
 }
  
 so.onclose=function(){
  so=false;
  lct.appendChild(A.$$(&#39;<p class="c2">退出聊天室</p>&#39;));
 }
  
 so.onmessage=function(msg){
  eval(&#39;var da=&#39;+msg.data);
  var obj=false,c=false;
  if(da.type==&#39;add&#39;){
  var obj=A.$$(&#39;<p>&#39;+da.name+&#39;</p>&#39;);
  lus.appendChild(obj);
  cuser(obj,da.code);
  obj=A.$$(&#39;<p><span>[&#39;+da.time+&#39;]</span>欢迎<a>&#39;+da.name+&#39;</a>加入</p>&#39;);
  c=da.code;
  }else if(da.type==&#39;madd&#39;){
  mkey=da.code;
  da.users.unshift({&#39;code&#39;:&#39;all&#39;,&#39;name&#39;:&#39;大家&#39;});
  for(var i=0;i<da.users.length;i++){
   var obj=A.$$(&#39;<p>&#39;+da.users[i].name+&#39;</p>&#39;);
   lus.appendChild(obj);
   if(mkey!=da.users[i].code){
   cuser(obj,da.users[i].code);
   }else{
   obj.className=&#39;my&#39;;
   document.title=da.users[i].name;
   }
  }
  obj=A.$$(&#39;<p><span>[&#39;+da.time+&#39;]</span>欢迎&#39;+da.name+&#39;加入</p>&#39;);
  users.all.className=&#39;ck&#39;;
  }
   
  if(obj==false){
  if(da.type==&#39;rmove&#39;){
   var obj=A.$$(&#39;<p class="c2"><span>[&#39;+da.time+&#39;]</span>&#39;+users[da.nrong].innerHTML+&#39;退出聊天室</p>&#39;);
   lct.appendChild(obj);
   users[da.nrong].del();
   delete users[da.nrong];
  }else{
   da.nrong=da.nrong.replace(/{\\(\d+)}/g,function(a,b){
   return &#39;<img  src="/static/imghwm/default1.png"  data-src="sk/&#39;+b+&#39;.gif"  class="lazy"   alt="Detailed explanation of how to use websocket in PHP" >&#39;;
   }).replace(/^data\:image\/png;base64\,.{50,}$/i,function(a){
   return &#39;<img  src="/static/imghwm/default1.png"  data-src="&#39;+a+&#39;"  class="lazy"   alt="Detailed explanation of how to use websocket in PHP" >&#39;;
   });
   //da.code 发信息人的code
   if(da.code1==mkey){
   obj=A.$$(&#39;<p class="c3"><span>[&#39;+da.time+&#39;]</span><a>&#39;+users[da.code].innerHTML+&#39;</a>对我说:&#39;+da.nrong+&#39;</p>&#39;);
   c=da.code;
   }else if(da.code==mkey){
   if(da.code1!=&#39;all&#39;)
   obj=A.$$(&#39;<p class="c3"><span>[&#39;+da.time+&#39;]</span>我对<a>&#39;+users[da.code1].innerHTML+&#39;</a>说:&#39;+da.nrong+&#39;</p>&#39;);
   else
   obj=A.$$(&#39;<p><span>[&#39;+da.time+&#39;]</span>我对<a>&#39;+users[da.code1].innerHTML+&#39;</a>说:&#39;+da.nrong+&#39;</p>&#39;);
   c=da.code1;
   }else if(da.code==false){
   obj=A.$$(&#39;<p><span>[&#39;+da.time+&#39;]</span>&#39;+da.nrong+&#39;</p>&#39;);
   }else if(da.code1){
   obj=A.$$(&#39;<p><span>[&#39;+da.time+&#39;]</span><a>&#39;+users[da.code].innerHTML+&#39;</a>对&#39;+users[da.code1].innerHTML+&#39;说:&#39;+da.nrong+&#39;</p>&#39;);
   c=da.code;
   }
  }
  }
  if(c){
   obj.children[1].onclick=function(){
   users[c].onclick();
   }
  }
  lct.appendChild(obj);
  lct.scrollTop=Math.max(0,lct.scrollHeight-lct.offsetHeight);
 }
 }
 A.$(&#39;sd&#39;).onclick=function(){
 if(!so){
  return st();
 }
 var da=A.$(&#39;nrong&#39;).value.trim();
 if(da==&#39;&#39;){
  alert(&#39;内容不能为空&#39;);
  return false; 
 }
 A.$(&#39;nrong&#39;).value=&#39;&#39;;
 so.send(&#39;nr=&#39;+esc(da)+&#39;&key=&#39;+key);
 }
 A.$(&#39;nrong&#39;).onkeydown=function(e){
 var e=e||event;
 if(e.keyCode==13){
  A.$(&#39;sd&#39;).onclick();
 }
 }
 function esc(da){
 da=da.replace(/</g,&#39;<&#39;).replace(/>/g,&#39;>&#39;).replace(/\"/g,&#39;"&#39;);
 return encodeURIComponent(da);
 }
 function cuser(t,code){
 users[code]=t;
 t.onclick=function(){
  t.parentNode.children.rcss(&#39;ck&#39;,&#39;&#39;);
  t.rcss(&#39;&#39;,&#39;ck&#39;);
  key=code;
 }
 }
 A.$(&#39;ltian&#39;).style.height=(document.documentElement.clientHeight - 70)+&#39;px&#39;;
 st();
  
 
 var bq=A.$(&#39;imgbq&#39;),ems=A.$(&#39;ems&#39;);
 var l=80,r=4,c=5,s=0,p=Math.ceil(l/(r*c));
 var pt=&#39;sk/&#39;;
 bq.onclick=function(e){
 var e=e||event;
 if(!so){
  return st();
 }
 ems.style.display=&#39;block&#39;;
 document.onclick=function(){
  gb(); 
 }
 ct();
 try{e.stopPropagation();}catch(o){}
 }
  
 for(var i=0;i<p;i++){
 var a=A.$$(&#39;<a href="javascript:;">&#39;+(i+1)+&#39;</a>&#39;);
 ems.children[1].appendChild(a);
 ef(a,i);
 }
 ems.children[1].children[0].className=&#39;ck&#39;;
  
 function ct(){
 var wz=bq.weiz();
 with(ems.style){
  top=wz.y-242+&#39;px&#39;;
  left=wz.x+bq.offsetWidth-235+&#39;px&#39;;
 }
 }
  
 function ef(t,i){
 t.onclick=function(e){
  var e=e||event;
  s=i*r*c;
  ems.children[0].innerHTML=&#39;&#39;;
  hh();
  this.parentNode.children.rcss(&#39;ck&#39;,&#39;&#39;);
  this.rcss(&#39;&#39;,&#39;ck&#39;);
  try{e.stopPropagation();}catch(o){}
 }
 }
  
 function hh(){
 var z=Math.min(l,s+r*c);
 for(var i=s;i<z;i++){
  var a=A.$$(&#39;<img  src="/static/imghwm/default1.png"  data-src="&#39;+pt+i+&#39;.gif"  class="lazy"   alt="Detailed explanation of how to use websocket in PHP" >&#39;);
  hh1(a,i);
  ems.children[0].appendChild(a);
 }
 ct();
 }
  
 function hh1(t,i){
 t.onclick=function(e){
  var e=e||event;
  A.$(&#39;nrong&#39;).value+=&#39;{\\&#39;+i+&#39;}&#39;;
  if(!e.ctrlKey){
  gb();
  }
  try{e.stopPropagation();}catch(o){}
 }
 }
  
 function gb(){
 ems.style.display=&#39;&#39;;
 A.$(&#39;nrong&#39;).focus();
 document.onclick=&#39;&#39;;
 }
 hh();
 A.on(window,&#39;resize&#39;,function(){
 A.$(&#39;ltian&#39;).style.height=(document.documentElement.clientHeight - 70)+&#39;px&#39;;
 ct();
 }) 
 
 var fimg=A.$(&#39;upimg&#39;);
 var img=new Image();
 var dw=400,dh=300;
 A.on(fimg,&#39;change&#39;,function(ev){
 if(!so){
  st();
  return false;
 }
 if(key==&#39;all&#39;){
  alert(&#39;由于资源限制 发图只能私聊&#39;);
  return false; 
 }
 var f=ev.target.files[0];
 if(f.type.match(&#39;image.*&#39;)){
  var r = new FileReader();
  r.onload = function(e){
  img.setAttribute(&#39;src&#39;,e.target.result);
   };
  r.readAsDataURL(f);
 }
 });
 img.onload=function(){
 ih=img.height,iw=img.width;
 if(iw/ih > dw/dh && iw > dw){
  ih=ih/iw*dw;
  iw=dw;
 }else if(ih > dh){
  iw=iw/ih*dh;
  ih=dh;
 }
 var rc = A.$$(&#39;canvas&#39;);
 var ct = rc.getContext(&#39;2d&#39;);
 rc.width=iw;
 rc.height=ih;
 ct.drawImage(img,0,0,iw,ih);
 var da=rc.toDataURL();
 so.send(&#39;nr=&#39;+esc(da)+&#39;&key=&#39;+key);
 }
  
})();
</script>
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持PHP中文网。

更多详解PHP中websocket的使用方法相关文章请关注PHP中文网!

Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
SpringBoot怎么整合WebSocket实现后端向前端发送消息SpringBoot怎么整合WebSocket实现后端向前端发送消息May 11, 2023 pm 02:07 PM

一、什么是websocket接口使用websocket建立长连接,服务端和客户端可以互相通信,服务端只要有数据更新,就可以主动推给客户端。WebSocket使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在WebSocketAPI中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。在WebSocketAPI中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

Python服务器编程:实现WebSocket服务端Python服务器编程:实现WebSocket服务端Jun 19, 2023 am 09:51 AM

近年来,WebSocket技术日渐流行,成为了浏览器与服务器之间进行实时通信的标准选择。在Python中,我们可以通过一些成熟的库来实现WebSocket服务端的开发。本文将在介绍WebSocket技术的基础上,探索如何利用Python开发WebSocket服务端。一、什么是WebSocketWebSocket是一种在单个TCP

SpringBoot怎么实现WebSocket即时通讯SpringBoot怎么实现WebSocket即时通讯May 12, 2023 am 09:13 AM

1、引入依赖org.springframework.bootspring-boot-starter-websocketorg.projectlomboklombokcom.alibabafastjson1.2.32、WebSocketConfig开启WebSocketpackagecom.shucha.deveiface.web.config;/***@authortqf*@Description*@Version1.0*@since2022-04-1215:35*/importorg.spri

在ThinkPHP6中使用Nginx反向代理Websocket在ThinkPHP6中使用Nginx反向代理WebsocketJun 20, 2023 pm 09:31 PM

在近几年的互联网应用中,Websocket已经成为了一种非常重要的通信协议。ThinkPHP6作为一款优秀的PHP开发框架,也提供了对Websocket的支持。不过,在使用Websocket时,我们通常会涉及到跨域、负载均衡等问题,因此,在这篇文章中,我们将介绍如何在ThinkPHP6中使用Nginx反向代理Websocket。首先,我们需要明确一下Webs

浏览器支持WebTransport?它能替代WebSockets?浏览器支持WebTransport?它能替代WebSockets?Feb 23, 2023 pm 03:36 PM

许多应用程序,如游戏和直播等场景,需要一种机制来尽可能快地发送消息,同时可以接受无序、不可靠的数据传输方式。本机应用程序虽然可以使用原始 UDP 套接字,但这些在 Web 上不可用,因为它们缺乏加密、拥塞控制、同意发送机制(以防止 DDoS 攻击)。

Spring Boot中使用WebSocket实现推送和通知功能Spring Boot中使用WebSocket实现推送和通知功能Jun 23, 2023 am 11:47 AM

在现代Web应用程序开发中,WebSocket是实现即时通信和实时数据传输的常用技术。SpringBoot框架提供了集成WebSocket的支持,使得开发者可以非常方便地实现推送和通知功能。本文将介绍SpringBoot中如何使用WebSocket实现推送和通知功能,并演示一个简单的实时在线聊天室的实现。创建SpringBoot项目首先,我们需要创建一

SpringBoot中怎么使用WebSocket实现点对点消息SpringBoot中怎么使用WebSocket实现点对点消息May 16, 2023 pm 12:58 PM

一、添加依赖,配置使用SpringSecurity里的用户。org.springframework.bootspring-boot-starter-security我们现在需要配置用户信息和权限配置。@ConfigurationpublicclassWebSecurityConfigextendsWebSecurityConfigurerAdapter{//指定密码的加密方式@SuppressWarnings("deprecation")@BeanPasswordEncode

如何在Linux中使用WebSocket技术如何在Linux中使用WebSocket技术Jun 18, 2023 pm 07:38 PM

随着现代网络应用程序的增多,WebSocket技术也变得非常流行。它是一项基于TCP协议的长连接技术,可以在客户端和服务器之间创建双向通信管道。在本文中,我们将介绍如何在Linux系统中使用WebSocket技术来创建一个简单的实时聊天应用程序。一、安装Node.js要使用WebSocket,首先需要在Linux系统中安装Node.j

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Tools

SublimeText3 English version

SublimeText3 English version

Recommended: Win version, supports code prompts!

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Integrate Eclipse with SAP NetWeaver application server.

WebStorm Mac version

WebStorm Mac version

Useful JavaScript development tools

SublimeText3 Linux new version

SublimeText3 Linux new version

SublimeText3 Linux latest version

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.