websocket是不同于http的另外一种网络通信协议，能够进行双向通信，基于此，可开发出各种实时通信产品，我简单做了个聊天室demo，顺便分享一下。
PHP的swoole扩展，正如作者所说，是PHP的异步、并行、高性能网络通信引擎，使用纯C语言编写，提供了PHP语言的异步多线程服务器，异步TCP/UDP网络客户端，异步MySQL，异步Redis，数据库连接池，AsyncTask，消息队列，毫秒定时器，异步文件读写，异步DNS查询。 Swoole内置了Http/WebSocket服务器端/客户端、Http2.0服务器端。
本demo用swoole来做server端，client端使用html5 websocket api，使用redis set数据结构存储连接标识。具体代码如下：
1，websocket.php：
<?php /** * Created by PhpStorm. * User: purelightme * Date: 2017/7/30 * Time: 15:24 */ $ws_server = new swoole_websocket_server('0.0.0.0', 9502); $redis = new Redis(); $redis->connect('127.0.0.1', 6379); //$redis->flushAll();exit; $ws_server->on('open', function ($ws, $request) use ($redis) { $redis->sAdd('fd', $request->fd); }); $ws_server->on('message', function ($ws, $frame) use ($redis) { global $redis; $fds = $redis->sMembers('fd'); foreach ($fds as $fd){ $ws->push($fd,$frame->fd.'--'.$frame->data); //发送二进制数据： $ws->push($fd,file_get_contents('http://imgsrc.baidu.com/imgad/pic/item/267f9e2f07082838b5168c32b299a9014c08f1f9.jpg'),WEBSOCKET_OPCODE_BINARY); } }); //监听WebSocket连接关闭事件 $ws_server->on('close', function ($ws, $fd) use ($redis) { $redis->sRem('fd',$fd); }); $ws_server->start();
2，websocket.html：
<!DOCTYPE html> <html> <head> <title></title> <meta charset="UTF-8"> <script type="text/javascript"> if(window.WebSocket){ var webSocket = new WebSocket("ws://0.0.0.0:9502"); webSocket.onopen = function (event) { //webSocket.send("Hello,WebSocket!"); }; webSocket.onmessage = function (event) { var content = document.getElementById('content'); if(event.data instanceof Blob) { var img = document.createElement("img"); img.src = window.URL.createObjectURL(event.data); content.appendChild(img); }else { content.innerHTML = content.innerHTML.concat('<p style="margin-left:20px;height:20px;line-height:20px;">用户id-'+event.data+'</p>'); } }; var sendMessage = function(){ var data = document.getElementById('message').value; webSocket.send(data); document.getElementById('message').value = ''; } }else{ console.log("您的浏览器不支持WebSocket"); } </script> </head> <body> <div style="600px;margin:0 auto;border:1px solid #ccc;"> <div id="content" style="overflow-y:auto;height:300px;"></div> <hr/> <div style="height:40px"> <input type="text" id="message" style="margin-left:10px;height:25px;450px;"> <button onclick="sendMessage()" style="height:28px;75px;">发送</button> </div> </div> </body> </html>
效果大概如下图，感兴趣的可以自己研究研究。。。
