swoole消息推送 | 易学教程

socket.php

// 注释的部分是学习的笔记

<?php
//创建websocket服务器对象，监听0.0.0.0:9502端口
$ws = new swoole_websocket_server("0.0.0.0", 9501);

//监听WebSocket连接打开事件
/**
 * 客户端想服务器发送信息是调用函数
 * $ws   websocket 服务器
 * $request 客户端信息
 * $request->fd 客户端唯一编号
 *
 * */
$ws->on('open', function ($ws, $request) {
    //var_dump($request->fd, $request->get, $request->server);
    //$ws->push($request->fd, "hello, welcome\n");
    echo "connection open:{$request->fd}\n";
    //$ws->push($request->fd, json_encode(['hello','world']));
});

//监听WebSocket消息事件
/**
 * $frame 客户端发送的信息
 * $frame->fd 客户端的唯一编号
 * $frame->data 客户端发送的信息
 * */
$ws->on('message', function ($ws, $frame) {
    //echo "接收到的信息: {$frame->data}\n";
    //$ws->push($frame->fd, "server: {$frame->data}");
    //echo "服务器已接收:【".$frame->fd."】";
    //$ws->push($frame->fd, json_encode(['hello','world'.$frame->data]));


    // 1.客户端发送过来的信息
    $content = $frame->data;
    echo "服务器接收到信息：".$content;
    // 2.讲消息发送个所有客户端
    foreach ($ws->connections as $fd){
        $ws->push($fd,$content);
    }
});

//监听WebSocket连接关闭事件
$ws->on('close', function ($ws, $fd) {
    echo "client-{$fd} is closed\n";
    echo "已断开链接:{$fd}";
});

$ws->start();

客户端显示数据：socket.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>客户端显示数据</title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js" ></script>
</head>
<body>
<ul id="show">

</ul>
</body>
<script>

    $(function(){
        //1.创建websocket客户端
        var wsServer = 'ws://192.168.70.167:9501';
        var websocket = new WebSocket(wsServer);

        //2.注册事件
            //2.1 当客户端和服务器简历连接时执行该函数
            websocket.onopen = function(){
                //console.log("连接上了服务器");
                addStr("连接上了服务器")
            }
            //2.2 当服务器想客户端发送消息时 执行该函数
            // event.data 就是服务器发送过来的信息
            websocket.onmessage = function(event){
                console.log("接收到服务器发送的信息："+event.data);
                addStr(event.data);

            }
            // 2.3 当客户端和服务器断开连接时执行函数
            websocket.onclose = function(event){
                console.log("断开了链接");
            }

    });

    /*websocket.onopen = function(){
        //console.log("连接上了服务器");
        websocket.send("连接上了服务器")
    }*/
    function addStr(str){
        $str = "<li>"+str+"</li>";
        $("#show").append($str);
    }
</script>
</html>

客户端发送数据：socket_add.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>客户端显示数据</title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js" ></script>
</head>
<body>
<ul id="show">

</ul>
</body>
<script>

    $(function(){
        //1.创建websocket客户端
        var wsServer = 'ws://192.168.70.167:9501';
        var websocket = new WebSocket(wsServer);

        //2.注册事件
            //2.1 当客户端和服务器简历连接时执行该函数
            websocket.onopen = function(){
                //console.log("连接上了服务器");
                addStr("连接上了服务器")
            }
            //2.2 当服务器想客户端发送消息时 执行该函数
            // event.data 就是服务器发送过来的信息
            websocket.onmessage = function(event){
                console.log("接收到服务器发送的信息："+event.data);
                addStr(event.data);

            }
            // 2.3 当客户端和服务器断开连接时执行函数
            websocket.onclose = function(event){
                console.log("断开了链接");
            }

    });

    /*websocket.onopen = function(){
        //console.log("连接上了服务器");
        websocket.send("连接上了服务器")
    }*/
    function addStr(str){
        $str = "<li>"+str+"</li>";
        $("#show").append($str);
    }
</script>
</html>

运行服务端