PHP practice of building a simple chat room based on websocket

The example in this article describes the practice of building a simple chat room in PHP based on websocket. Share it with everyone for your reference. The details are as follows:
1. Foreword

There is a simple chat room in the company's game. After understanding it, I realized that it was made by node+websocket. I thought about using PHP to make a simple chat room. So I collected various information, read documents, looked for examples, and wrote a simple chat room myself.

http connections are divided into short connections and long connections. Short connections can generally be implemented using ajax, and long connections are websockets. Short connections are relatively simple to implement, but consume too many resources. Websocket is efficient but has some issues with compatibility. Websocket is a resource of html5

2. Front-end

It is very simple and straightforward to implement websocket on the front-end

//连接websocket
 
var ws = new WebSocket("ws://127.0.0.1:8000");
 
//成功连接websoc的时候
 
ws.onopen = function(){}
 
//成功获取服务端输出的消息
 
ws.onmessage = function(e){}
 
//连接错误的时候
ws.onerror = function(){}
 
//向服务端发送数据
 
ws.send();

3. Backend

The difficulty of websocket is mainly in the background

3.1 websocket connection process
websocket communication diagram This is a simple client Illustration of communication between client and server. What PHP mainly does is to accept the encryption key and return it to complete the socket creation and handshake operation. The picture below is a detailed flow chart of the server processing websocket.

3.2 Code practice

The process done by the server is roughly:

Hang a socket process and wait for the connection

Traverse the socket array after there is a socket connection

Perform handshake operation if there is no handshake , if the handshake has been done, the data is parsed and written into the buffer for output

The following is the sample code (I wrote a class, so the code is segmented according to the function), the bottom of the text gives the github address and what I encountered Some pitfalls

1. First create a socket

//建立套接字
    public function createSocket($address,$port)
    {
      //创建一个套接字
      $socket= socket_create(AF_INET, SOCK_STREAM, SOL_TCP);
      //设置套接字选项
      socket_set_option($socket, SOL_SOCKET, SO_REUSEADDR, 1);
      //绑定IP地址和端口
      socket_bind($socket,$address,$port);
      //监听套接字
      socket_listen($socket);
      return $socket;
    }

2. Put the socket into an array

public function __construct($address,$port)
    {
      //建立套接字
      $this->soc=$this->createSocket($address,$port);
      $this->socs=array($this->soc);
 
    }

3. Suspend the process to traverse the socket array. The main operations are Completed here

public function run(){
      //挂起进程
      while(true){
        $arr=$this->socs;
        $write=$except=NULL;
        //接收套接字数字 监听他们的状态
        socket_select($arr,$write,$except, NULL);
        //遍历套接字数组
        foreach($arr as $k=>$v){
          //如果是新建立的套接字返回一个有效的 套接字资源
          if($this->soc == $v){
            $client=socket_accept($this->soc);
            if($client <0){
              echo "socket_accept() failed";
            }else{
              // array_push($this->socs,$client);
              // unset($this[]);
              //将有效的套接字资源放到套接字数组
              $this->socs[]=$client;
            }
          }else{
            //从已连接的socket接收数据 返回的是从socket中接收的字节数
            $byte=socket_recv($v, $buff,20480, 0);
            //如果接收的字节是0
            if($byte<7)
              continue;
            //判断有没有握手没有握手则进行握手,如果握手了 则进行处理
            if(!$this->hand[(int)$client]){
              //进行握手操作
              $this->hands($client,$buff,$v);
            }else{
              //处理数据操作
              $mess=$this->decodeData($buff);
                //发送数据
              $this->send($mess,$v);
            }
          }
        }
      }
    }

4. The handshake process is to receive the websocket content, obtain the key from Sec-WebSocket-Key: and write it into the buffer through the encryption algorithm. The client will verify (automatic verification does not require us Processing)

public function hands($client,$buff,$v)
    {
      //提取websocket传的key并进行加密 （这是固定的握手机制获取Sec-WebSocket-Key:里面的key）
      $buf = substr($buff,strpos($buff,'Sec-WebSocket-Key:')+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($v,$new_message,strlen($new_message));
      // socket_write(socket,$upgrade.chr(0), strlen($upgrade.chr(0)));
      //标记此套接字握手成功
      $this->hand[(int)$client]=true;
    }

5. Parse the client data (I did not encrypt it here, you can encrypt it yourself if necessary)

//解析数据
    public function decodeData($buff)
    {
      //$buff 解析数据帧
      $mask = array();
      $data = '';
      $msg = unpack('H*',$buff); //用unpack函数从二进制将数据解码
      $head = substr($msg[1],0,2);
      if (hexdec($head{1}) === 8) {
        $data = false;
      }else if (hexdec($head{1}) === 1){
        $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));
          //遇到的问题 刚连接的时候就发送数据 显示 state connecting
        $s = 12;
        $e = strlen($msg[1])-2;
        $n = 0;
        for ($i=$s; $i<= $e; $i+= 2) {
          $data .= chr($mask[$n%4]^hexdec(substr($msg[1],$i,2)));
          $n++;
        }
        //发送数据到客户端
          //如果长度大于125 将数据分块
          $block=str_split($data,125);
          $mess=array(
            &#39;mess&#39;=>$block[0],
            );
        return $mess;         
      }

6. Write the socket to the buffer

//发送数据
    public function send($mess,$v)
    {
      //遍历套接字数组 成功握手的 进行数据群发
      foreach ($this->socs as $keys => $values) {
        //用系统分配的套接字资源id作为用户昵称
          $mess['name']="Tourist's socket:{$v}";
          $str=json_encode($mess);
          $writes ="\x81".chr(strlen($str)).$str;
          // ob_flush();
          // flush();
          // sleep(3);
          if($this->hand[(int)$values])
            socket_write($values,$writes,strlen($writes));
        }
    }

7. Running method

github address git@github.com:rsaLive/websocket.git

①It is best to run server.php in the console

Go to the server.php script directory (you can first php -v Check if php is configured. If there is no Linux configuration, configure bash windows under path)

php -f server.php

If there is an error, it will prompt

②Access html files through the server

8. For pitfalls that have been stepped on, open debugging to facilitate checking errors

①server.php can print out the hung process. If there is a problem, you can add printing to the code for debugging

You can check it in each judgment Make a mark on the console to see which section the code is running in. However, you need to re-run the script php server.php every time you modify the code. Send data when connecting (content cannot be sent during the first verification handshake with the server)

2. This will also happen if the client has verified but the client has not sent it or the message sent is empty

So To verify the data of a connected socket

③可能浏览器不支持或者服务端没有开启socket开始之前最好验证下

if (window.WebSocket){
  console.log("This browser supports WebSocket!");
} else {
  console.log("This browser does not support WebSocket.");
}

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

更多PHP practice of building a simple chat room based on websocket相关文章请关注PHP中文网！