WebSocket · PHP/Python/前端/Linux 等等學習筆記

[TOC] ## Web Socket Web Socket協議是基于TCP的一種新的網絡協議。它實現了瀏覽器與服務器全雙工full -duplex)通信——**允許服務器主動發送信息給客戶端**。 http 的通信只能由客戶端去發起 Websockett特點 - 建立在TCP協議之上 - 性能開銷小通信高效 - 客戶端可以與任意服務器通信 - 協議標識符 WS WSS - 持久化網絡通信協議 ## demo `server/websocket.php` ``` $server = new swoole_websocket_server("0.0.0.0", 8812); $server->on('open', function (swoole_websocket_server $server, $request) { echo "server: handshake success with fd: ".$request->fd."\n"; }); $server->on('message', function (swoole_websocket_server $server, $frame) { echo "receive from {$frame->fd}:{$frame->data},opcode:{$frame->opcode},fin:{$frame->finish}\n"; //push 把數據發送給終端 $server->push($frame->fd, "this is server"); }); $server->on('close', function ($ser, $fd) { echo "client {$fd} closed\n"; }); $server->start(); ``` `data/ws_client.html` ``` <!DOCTYPE html> <html lang="zh-cmn-Hans"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>Title</title> </head> <body> <h1>測試</h1> <script> var wxUrl = "ws://127.0.0.1:8812"; var websocket = new WebSocket(wxUrl); //連接后觸發 websocket.onopen = function (event) { websocket.send("hello word"); //發送數據給websocket.php console.log("connnect-success"); } websocket.onmessage = function (event){ console.log('ws-server-return-data'+event.data); } websocket.onclose = function(event){ console.log('close'); } websocket.onerror = function(event){ console.log('error:' + event.data); } </script> </body> </html> ``` ### 啟動方法在開啟 webscoket.php狀態下 1. 直接雙擊打開` ws_client.html` 2. 通過 http_server.php 然后在 http_server.php中設置了`document_root`的目錄下打開 3. 只在websocket.php 中設置 ``` $server->set([ 'document_root' => '/Users/idcpj/Web/swoole/data/', //靜態文件存放路徑 'enable_static_handler' => true, ]); ``` 然后直接訪問靜態文件即可,無需 http_server.php ## 面向對象的 demo ``` class ws{ const HOST = '0.0.0.0'; const PORT = 8812; const CHART_PORT = 8813; public $ws = null; public function __construct(){ $this->ws = new swoole_websocket_server("0.0.0.0", 8812); //添加監聽端口,用于 $this->ws->listen(self::HOST, self::CHART_PORT, SWOOLE_SOCK_TCP); $this->ws->on('open',[$this,'onOpen']); $this->ws->on('message',[$this,'onMsg']); $this->ws->on('close',[$this,'onClose']); $this->ws->start(); } //監聽連接事件 public function onOpen($ws, $request){ print_r($request->fd); } //監聽ws消息事件 public function onMsg($ws,$frame){ echo "ser-push-message".$frame->data."\n"; $ws->push($frame->fd,'server-push'.date('Y-m-d H:i:s',time())); } public function onClose($ws,$fd){ echo "clientid:{$fd}\n"; } } ``` ## 獲取連接的 id 并放入 redis 中在 `open` 事件中用redis的 sAdd 存儲有序集合 id ``` //存儲只是原來 demo redis()->sAdd('live_game_key',$id); //查看在 redis-cli SMEMBERS live_game_key ``` 在` close` 中刪除連接的 id