masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > php教程 > php手册 > php+websocket搭建简易聊天室实践

php+websocket搭建简易聊天室实践

WBOY
Lepaskan： 2016-10-24 00:00:00
asal
1934 orang telah melayarinya

1、前言

　　公司游戏里面有个简单的聊天室，了解了之后才知道是node+websocket做的，想想php也来做个简单的聊天室。于是搜集各种资料看文档、找实例自己也写了个简单的聊天室。

　　http连接分为短连接和长连接。短连接一般可以用ajax实现，长连接就是websocket。短连接实现起来比较简单，但是太过于消耗资源。websocket高效不过兼容存在点问题。websocket是html5的资源

　　如果想要详细了解websocket长连接的原理请看https://www.zhihu.com/question/20215561。

　　本文主要介绍websocket简易聊天室的实现步骤具体部分知识点的深入会给出链接或者麻烦读者自己搜集资料。

2、前端

　　前端实现websocket很简单直接

　　//连接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、后台

    websocket的难点主要在后台

　　3.1websocket连接过程

　　websocket 通信图解 这是一个简易的客户端和服务端的通信图解，php主要就做的就是接受加密key  并返回 其中完成套接字的创建和握手操作

　　

  　　下图是一张详细的服务端处理websocket的流程图

　　

   　　

3.2 代码实践

　　服务端做的流程大致是：

　　　　①、挂起一个socket套接字进程等待连接

　　　　②、有socket连接之后遍历套接字数组

　　　　③、没有握手的进行握手操作，如果已经握手则接收数据解析并写入缓冲区进行输出

　　下面是示例代码（我写的是一个类所以代码是根据函数分段的），文底给出github地址以及自己遇到的一些坑

     1、首先是创建套接字

<span style="color: #008000;">//</span><span style="color: #008000;">建立套接字</span>
        <span style="color: #0000ff;">public</span> <span style="color: #0000ff;">function</span> createSocket(<span style="color: #800080;">$address</span>,<span style="color: #800080;">$port</span><span style="color: #000000;">)
        {
            </span><span style="color: #008000;">//</span><span style="color: #008000;">创建一个套接字</span>
            <span style="color: #800080;">$socket</span>= socket_create(AF_INET, SOCK_STREAM,<span style="color: #000000;"> SOL_TCP);
            </span><span style="color: #008000;">//</span><span style="color: #008000;">设置套接字选项</span>
            socket_set_option(<span style="color: #800080;">$socket</span>, SOL_SOCKET, SO_REUSEADDR, 1<span style="color: #000000;">);
            </span><span style="color: #008000;">//</span><span style="color: #008000;">绑定IP地址和端口</span>
            socket_bind(<span style="color: #800080;">$socket</span>,<span style="color: #800080;">$address</span>,<span style="color: #800080;">$port</span><span style="color: #000000;">);
            </span><span style="color: #008000;">//</span><span style="color: #008000;">监听套接字</span>
            socket_listen(<span style="color: #800080;">$socket</span><span style="color: #000000;">);
            </span><span style="color: #0000ff;">return</span> <span style="color: #800080;">$socket</span><span style="color: #000000;">;
        }</span>
Salin selepas log masuk

  2、将套接字放入数组

<span style="color: #0000ff;">public</span> <span style="color: #0000ff;">function</span>  __construct(<span style="color: #800080;">$address</span>,<span style="color: #800080;">$port</span><span style="color: #000000;">)
        {
            </span><span style="color: #008000;">//</span><span style="color: #008000;">建立套接字</span>
            <span style="color: #800080;">$this</span>->soc=<span style="color: #800080;">$this</span>->createSocket(<span style="color: #800080;">$address</span>,<span style="color: #800080;">$port</span><span style="color: #000000;">);
            </span><span style="color: #800080;">$this</span>->socs=<span style="color: #0000ff;">array</span>(<span style="color: #800080;">$this</span>-><span style="color: #000000;">soc);

        }</span>
Salin selepas log masuk

 

3、挂起进程遍历套接字数组，主要操作都是在这里面完成的

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

 

4、进行握手 流程是接收websocket内容从Sec-WebSocket-Key:中获取key并通过加密算法写入缓冲区客户端会进行验证（自动验证不需要我们处理）

<span style="color: #0000ff;">public</span> <span style="color: #0000ff;">function</span> hands(<span style="color: #800080;">$client</span>,<span style="color: #800080;">$buff</span>,<span style="color: #800080;">$v</span><span style="color: #000000;">)
        {
            </span><span style="color: #008000;">//</span><span style="color: #008000;">提取websocket传的key并进行加密  （这是固定的握手机制获取Sec-WebSocket-Key:里面的key）</span>
            <span style="color: #800080;">$buf</span>  = <span style="color: #008080;">substr</span>(<span style="color: #800080;">$buff</span>,<span style="color: #008080;">strpos</span>(<span style="color: #800080;">$buff</span>,'Sec-WebSocket-Key:')+18<span style="color: #000000;">);
            </span><span style="color: #008000;">//</span><span style="color: #008000;">去除换行空格字符</span>
            <span style="color: #800080;">$key</span>  = <span style="color: #008080;">trim</span>(<span style="color: #008080;">substr</span>(<span style="color: #800080;">$buf</span>,0,<span style="color: #008080;">strpos</span>(<span style="color: #800080;">$buf</span>,"\r\n"<span style="color: #000000;">)));
             </span><span style="color: #008000;">//</span><span style="color: #008000;">固定的加密算法</span>
            <span style="color: #800080;">$new_key</span> = <span style="color: #008080;">base64_encode</span>(<span style="color: #008080;">sha1</span>(<span style="color: #800080;">$key</span>."258EAFA5-E914-47DA-95CA-C5AB0DC85B11",<span style="color: #0000ff;">true</span><span style="color: #000000;">));
            </span><span style="color: #800080;">$new_message</span> = "HTTP/1.1 101 Switching Protocols\r\n"<span style="color: #000000;">;
            </span><span style="color: #800080;">$new_message</span> .= "Upgrade: websocket\r\n"<span style="color: #000000;">;
            </span><span style="color: #800080;">$new_message</span> .= "Sec-WebSocket-Version: 13\r\n"<span style="color: #000000;">;
            </span><span style="color: #800080;">$new_message</span> .= "Connection: Upgrade\r\n"<span style="color: #000000;">;
            </span><span style="color: #800080;">$new_message</span> .= "Sec-WebSocket-Accept: " . <span style="color: #800080;">$new_key</span> . "\r\n\r\n"<span style="color: #000000;">;
            </span><span style="color: #008000;">//</span><span style="color: #008000;">将套接字写入缓冲区</span>
            socket_write(<span style="color: #800080;">$v</span>,<span style="color: #800080;">$new_message</span>,<span style="color: #008080;">strlen</span>(<span style="color: #800080;">$new_message</span><span style="color: #000000;">));
            </span><span style="color: #008000;">//</span><span style="color: #008000;"> socket_write(socket,$upgrade.chr(0), strlen($upgrade.chr(0)));
            //标记此套接字握手成功</span>
            <span style="color: #800080;">$this</span>->hand[(int)<span style="color: #800080;">$client</span>]=<span style="color: #0000ff;">true</span><span style="color: #000000;">;
        }</span>
Salin selepas log masuk

5、解析客户端的数据（我这里没有进行加密，如果有需要也可以自己加密 ）

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

 

6、将套接字写入缓冲区

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

 

7、运行方法

github地址git@github.com:rsaLive/websocket.git

①最好在控制台运行server.php

转到server.php脚本目录(可以先php -v 看下有没有配置php如果没有Linux配置下bash windows 配置下path)

php -f server.php

如果有错误会提示

②通过服务器访问html文件

 

 8、踩过的坑，打开调试工作方便查看错误

①server.php 挂起的进程中可以打印输出的，如果出现问题可以在代码中加入打印来调试 

可以在各个判断里面做标记在控制台查看代码运行在哪个区间

不过每次修改完代码之后需要重新运行脚本 php server.php

②

如果出现这种错误可能是

　　1、在与服务器初始套接字的时候发送数据 （在第一次与服务器验证握手的时候不能发送内容）

　　2、如果已经验证过了但是客户端没有发送或者发送的消息为空也会出现这样的情况

　　　　所以要检验已连接的套接字的数据

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

<span style="color: #000000;">if (window.WebSocket){
    console.log("This browser supports WebSocket!");
} else {
    console.log("This browser does not support WebSocket.");
}</span>
Salin selepas log masuk

 

如有不正欢迎指出

 

Label berkaitan：
php+websocket搭建简易聊天室实践
sumber：php.cn
Artikel sebelumnya：thinkphp分页类 php通用分页类 v1.1 Artikel seterusnya：方法重载（重写）/方法覆盖、魔术函数实现
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...
daripada 2024-04-29 11:01:01
0
3
2176
Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?
daripada 2024-04-23 00:22:19
0
11
2327
Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.
daripada 2024-04-19 15:37:47
0
1
1958
Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...
daripada 2024-04-18 23:52:34
0
1
1841
Di manakah perisian kursus tentang pemetaan minda CSS? Perisian kursus
daripada 2024-04-16 10:10:18
0
0
1890
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan