swoole基础之websocket服务

    websocket协议是基于tcp的一种新的网络协议.它实现了浏览器与服务器全双工通信 - 允许服务器主动向客户端发送消息

 

 

websocket的请求与普通的HTTP的请求不同支持,可以通过请求头,看出一些端倪:

    general
Request URL: ws://192.168.33.20:8812/
Request Method: GET
Status Code: 101 Switching Protocols

    response headers
Connection: Upgrade
Sec-WebSocket-Accept: zseQp96R61ggKKae17nEtDbA5gQ=
Sec-WebSocket-Version: 13
Server: swoole-websocket-server
Upgrade: websocket

    request headers
Accept-Encoding: gzip, deflate
Accept-Language: zh-CN,zh;q=0.9,en;q=0.8
Cache-Control: no-cache
Connection: Upgrade
Host: 192.168.33.20:8812
Origin: http://ws.xing.com:8812
Pragma: no-cache
Sec-WebSocket-Extensions: permessage-deflate; client_max_window_bits
Sec-WebSocket-Key: Tuc/NFlp1kDiTanApuuiPQ==
Sec-WebSocket-Version: 13
Upgrade: websocket
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36

 

基本代码如下:

      服务端:

//websocket 服务

$ser = new swoole_websocket_server('0.0.0.0',8812);

$ser->set([
	'enable_static_handler' =>      true, //设置静态资源处理
    'document_root'         =>      '/usr/local/nginx/html/swoole/server/data',
]); //设置参数

//建立链接绑定事件

$ser->on('open','onOpen');

function onOpen($ser,$request){
	print_r($request->fd);
}

//接收信息事件
$ser->on('message','onMessage');

function onMessage($ser,$frame)
{
	echo "from {$frame->fd}:{$frame->data} ,opcode:{$frame->opcode}, isFinish:{$frame->finish}\n";
$ser->push($frame->fd, "this is server");
}

$ser->on('close',function($ser,$fd){
	echo "client {$fd} closed \n";
});

$ser->start();

 

    客户端可使用原生方法:

<script>
var wsUrl = 'ws://192.168.33.20:8812';

        var websocket = new WebSocket(wsUrl);
        websocket.onopen = function(evt){
        websocket.send('hello socket');
        console.log('connect-swoole-success');
}

        websocket.onmessage = function(evt){
        console.log('ws-srver-return-data:'+evt.data);
}

        websocket.onclose = function(evt){
        console.log('ws-closed');
}

        websocket.onerror = function(evt,e){
        console.log('error:'+evt.data);
}
</script>