用swoole擴充套件編寫WebSocket聊天室
阿新 • • 發佈：2019-01-29
最近正在接觸swoole擴充套件 先寫個簡單的swoole聊天室demo吧
<!DOCTYPE html> <html> <head> <title>swoole chatroom</title> <meta charset="UTF-8"> <script type="text/javascript"> var exampleSocket = new WebSocket("ws://0.0.0.0:9501"); exampleSocket.onopen = function (event) { exampleSocket.send("連線!"); }; exampleSocket.onmessage = function (event) { var chat_room = document.querySelector("#chatroom"); var data = event.data; var chat_list = document.createElement("li"); var chat_content = document.createTextNode(data); chat_list.appendChild(chat_content); chat_room.appendChild(chat_list); } </script> </head> <body> <input type="text" id="content"> <button onclick="exampleSocket.send( document.getElementById('content').value )">傳送</button> <div id="chatroom"> <ul id="chatlist"> </ul> </div> </body> </html>
用的是連線方式是WebSocket
使用將onopen繫結到WebSocket事件原因是因為建立WebSocket的方式是非同步的，所以要在其成功建立物件時確定連線是否成功
onmessage是接受訊息時觸發的方法
<?php $server = new swoole_websocket_server("0.0.0.0", 9501); $max = 0; $server->on('open', function (swoole_websocket_server $server, $req) { //每一次客戶端連線 最大連線數將增加 global $max; $max++; }); $server->on('message', function (swoole_websocket_server $server, $frame) { $fd = $frame->fd; $data = $frame->data; $message = "連線號{$fd}：內容：{$data}"; global $max; //向所有人廣播 for ($i = 1; $i <= $max; $i++) { echo PHP_EOL . time('Y-m-d h:m:s') . ': ' . $fd . " : " . $data; $server->push($i, $message); } }); $server->on('close', function (swoole_websocket_server $server, $fd) { //關閉連線 連線減少 global $max; $max--; echo "client {$fd} closed\n"; }); $server->start();
服務端的原理：
全域性變數$max儲存連線數，每當發生一個WebSocket連線時，$max加一
取得連線後，用push向所有連線進行廣播
關閉連線時，連線數減少
然而這仍然存在一些問題 比如當瀏覽器重新整理的時候 沒有close掉舊的連線 而是又建立了一個新的連線
這些在該demo裡都沒有得到處理