@phper 2017-05-04T10:17:14.000000Z 字数 2746 阅读 5339

swoole深入学习 7. WebSocket

swoole

swoole也是支持WebSocket的。websocket也是基于单个TCP 连接上进行全双工通讯的协议，简单的说它是支持长连接。全双工通讯异味这信息的实时性。在websocket之前一直用long poll 和 ajax轮询的方式来实现实时通讯。

websocket既然是基于TCP，那么也分服务端，和客户端。

websocket 例子

先直接来看下，swoole如何实现一个websocket服务端吧：

<?php
/**
 * WebSocket
 * User: yangyi
 * Date: 2017/5/4
 * Time: 11:54
 */
$server = new Swoole\WebSocket\Server("0.0.0.0", 9502);
$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";
    $server->push($frame->fd, "this is server");
});
$server->on('close', function (Swoole\WebSocket\Server $server, $fd) {
    echo "client {$fd} closed\n";
});
$server->start();

启动服务。

php websocket_server.php

然后，再来实现一个简单的html js websocket 客户端：

<!DOCTYPE HTML>
<html>
<head>
    <script type="text/javascript">
        function WebSocketTest() {
            if ("WebSocket" in window) {
                alert("WebSocket is supported by your Browser!");
                // Let us open a web socket
                var ws = new WebSocket("ws://localhost:9502");
                ws.onopen = function(){
                    // Web Socket is connected, send data using send()
                    ws.send("Message to send");
                    alert("send:Message is sent...");
                };
                ws.onmessage = function (evt) {
                    var received_msg = evt.data;
                    alert("received:" + received_msg);
                };
                ws.onclose = function() {
                    // websocket is closed.
                    alert("Connection is closed...");
                };
            } else {
                // The browser doesn't support WebSocket
                alert("WebSocket NOT supported by your Browser!");
            }
        }
    </script>
</head>
<body>
<div id="sse">
    <a href="javascript:WebSocketTest()">Run WebSocket</a>
</div>
</body>
</html>

在浏览器打开这个页面，点击，就可以看到弹框消息了。打开控制台可以看到有2条消息在实时传输：

Data	Length	Time
Message to send	15	15:55:08.792
this is server	14	15:55:10.445

服务端的日志也可以看到：

server: handshake success with fd14
receive from 14:Message to send,opcode:1,fin:1

websocket的几个回调函数

onOpen

当WebSocket客户端与服务器建立连接并完成握手后会回调此函数。

$server->on('open', function (Swoole\WebSocket\Server $server, $request) {
    echo "server: handshake success with fd{$request->fd}\n";
});

$req 是一个Http请求对象，包含了客户端发来的握手请求信息
onOpen事件函数中可以调用push向客户端发送数据或者调用close关闭连接
onOpen事件回调是可选的

onMessage

当服务器收到来自客户端的数据帧时会回调此函数。

function onMessage(swoole_server $server, swoole_websocket_frame $frame)

$frame 是swoole_websocket_frame对象，包含了客户端发来的数据帧信息
onMessage回调必须被设置，未设置服务器将无法启动
客户端发送的ping帧不会触发onMessage，底层会自动回复pong包

$frame 共有4个属性，分别是:

$frame->fd，客户端的socket id，使用$server->push推送数据时需要用到。
$frame->data，数据内容，可以是文本内容也可以是二进制数据，可以通过opcode的值来判断
$frame->opcode，WebSocket的OpCode类型，可以参考WebSocket协议标准文档
$frame->finish，表示数据帧是否完整，一个WebSocket请求可能会分成多个数据帧进行发送

$data 如果是文本类型，编码格式必然是UTF-8，这是WebSocket协议规定的

向客户端发送信息 push

向websocket客户端连接推送数据，长度最大不得超过2M。

function swoole_websocket_server->push(int $fd, string $data, int $opcode = 1, bool $finish = true);

$fd 客户端连接的ID，如果指定的$fd对应的TCP连接并非websocket客户端，将会发送失败
$data 要发送的数据内容
$opcode，指定发送数据内容的格式，默认为文本。发送二进制内容$opcode参数需要设置为WEBSOCKET_OPCODE_BINARY_FRAME

发送成功返回true，发送失败返回false