使用Swoole搭建一個簡單的聊天室

效果如圖：

大緻思路：

• 完成 html 靜态頁面，點選發送按鈕可以使用 JavaScript 在頁面上添加一條新的消息
• php 後端建立 webSocket 類，完成 webSocket 服務，監聽端口
• 頁面中建立 webSocket 和 php 後端接口連接配接
• 發送消息的時候，調用 JavaScript 中 webSocket 的 send 方法，發送資料到後端
• 後端監聽到消息時，傳回給所有用戶端資訊
• 用戶端拿到後端傳回的消息在頁面上顯示

後端建立 WebSocket 時，onMessage 是一個必要的回調方法。它在監聽到頁面發送消息的時候調用，可以在這個方法裡傳回給頁面資料，其中 connections 是連接配接疊代器，可以周遊所有的連接配接，可以用這個屬性實作一對多的傳回用戶端資料：

/**
     * 接收到用戶端發送的資訊的回調方法
     * @param $serv
     * @param $frame
     */
    public function onMessage($serv, $frame)
    {
        echo "receive from {$frame->fd}:{$frame->data},opcode:{$frame->opcode},fin:{$frame->finish}\n";

        //  周遊所有連接配接的用戶端
        foreach($serv->connections as $fd)
        {
            $fd == $frame->fd ? '0' : '1';
            $serv->push($fd, $this->param($frame->data,$fd,$frame->fd));
        }
        //  向發送消息的用戶端推送資料
        //  $serv->push($frame->fd, $frame->data);
    }
           

後端周遊所有連接配接時，判斷目前連接配接和發起請求的連接配接是否為同一個，如果是同一個，則新的消息顯示在右邊。否則，反之。

github位址：https://github.com/ljhe/Chart