Hyperf+RabbitMQ+WebSocket实现大屏幕消息推送

点击上方“阿拉奇学Java”,选择“置顶或者星标

 每天早晨0000分,与你相约!

Hyperf+RabbitMQ+WebSocket实现大屏幕消息推送_第1张图片

往日回顾:秀!这款工具让SpringBoot不再需要Controller、Service、DAO、Mapper!

介绍

基于 Hyperf+ WebSocket +RabbitMQ 实现的一个简单大屏幕的消息推送。

思路

利用 WebSocket 协议让客户端和服务器端保持有状态的长链接,

保存链接上来的客户端 id。订阅发布者发布的消息针对已保存的客户端 id 进行广播消息。

WebSocket 服务

composer require hyperf/websocket-server

配置文件 [config/autoload/server.php]

 SWOOLE_PROCESS,
    'servers' => [
        [
            'name' => 'http',
            'type' => Server::SERVER_HTTP,
            'host' => '0.0.0.0',
            'port' => 11111,
            'sock_type' => SWOOLE_SOCK_TCP,
            'callbacks' => [
                SwooleEvent::ON_REQUEST => [Hyperf\HttpServer\Server::class, 'onRequest'],
            ],
        ],
        [
            'name' => 'ws',
            'type' => Server::SERVER_WEBSOCKET,
            'host' => '0.0.0.0',
            'port' => 12222,
            'sock_type' => SWOOLE_SOCK_TCP,
            'callbacks' => [
                SwooleEvent::ON_HAND_SHAKE => [Hyperf\WebSocketServer\Server::class, 'onHandShake'],
                SwooleEvent::ON_MESSAGE => [Hyperf\WebSocketServer\Server::class, 'onMessage'],
                SwooleEvent::ON_CLOSE => [Hyperf\WebSocketServer\Server::class, 'onClose'],
            ],
        ],
    ],

WebSocket 服务器端代码示例

container->get(\Redis::class);
        //获取所有的客户端id
        $fdList = $redis->sMembers('websocket_sjd_1');
        //如果当前客户端在客户端集合中,就刷新
        if (in_array($frame->fd, $fdList)) {
            $redis->sAdd('websocket_sjd_1', $frame->fd);
            $redis->expire('websocket_sjd_1', 7200);
        }
        $server->push($frame->fd, 'Recv: ' . $frame->data);
    }
    /**
     * 客户端失去链接
     * @param Server $server
     * @param int $fd
     * @param int $reactorId
     */
    public function onClose(Server $server, int $fd, int $reactorId): void
{
        //删掉客户端id
        $redis = $this->container->get(\Redis::class);
        //移除集合中指定的value
        $redis->sRem('websocket_sjd_1', $fd);
        var_dump('closed');
    }
    /**
     * 客户端链接
     * @param WebSocketServer $server
     * @param Request $request
     */
    public function onOpen(WebSocketServer $server, Request $request): void
{
        //保存客户端id
        $redis = $this->container->get(\Redis::class);
        $res1 = $redis->sAdd('websocket_sjd_1', $request->fd);
        var_dump($res1);
        $res = $redis->expire('websocket_sjd_1', 7200);
        var_dump($res);
        $server->push($request->fd, 'Opened');
    }
}

WebSocket 前端代码

function WebSocketTest() {
    if ("WebSocket" in window) {
        console.log("您的浏览器支持 WebSocket!");
        var num = 0
        // 打开一个 web socket
        var ws = new WebSocket("ws://127.0.0.1:12222");
        ws.onopen = function () {
            // Web Socket 已连接上,使用 send() 方法发送数据
            //alert("数据发送中...");
            //ws.send("发送数据");
        };
        window.setInterval(function () { //每隔5秒钟发送一次心跳,避免websocket连接因超时而自动断开
            var ping = {"type": "ping"};
            ws.send(JSON.stringify(ping));
        }, 5000);
       ws.onmessage = function (evt) {
            var d = JSON.parse(evt.data);
            console.log(d);
            if (d.code == 300) {
                $(".address").text(d.address)
            }
      if (d.code == 200) {
                var v = d.data
                console.log(v);
                num++
                var str = `

${v.recordOutTime}

${v.userOutName}

${v.userOutNum}

${v.doorOutName}

` $(".tableHead").after(str) if (num > 7) { num-- $(".table .item:nth-last-child(1)").remove() } } }; ws.error = function (e) { console.log(e) alert(e) } ws.onclose = function () { // 关闭 websocket alert("连接已关闭..."); }; } else { alert("您的浏览器不支持 WebSocket!"); } }

AMQP 组件

composer require hyperf/amqp

配置文件 [config/autoload/amqp.php]

 [
        'host' => 'localhost',
        'port' => 5672,
        'user' => 'guest',
        'password' => 'guest',
        'vhost' => '/',
        'pool' => [
            'min_connections' => 1,
            'max_connections' => 10,
            'connect_timeout' => 10.0,
            'wait_timeout' => 3.0,
            'heartbeat' => -1,
        ],
        'params' => [
            'insist' => false,
            'login_method' => 'AMQPLAIN',
            'login_response' => null,
            'locale' => 'en_US',
            'connection_timeout' => 3.0,
            'read_write_timeout' => 6.0,
            'context' => null,
            'keepalive' => false,
            'heartbeat' => 3,
        ],
    ],
];

MQ 消费者代码

container->get(\Redis::class);
        $fdList=$redis->sMembers('websocket_sjd_1');
        $server=$this->container->get(ServerFactory::class)->getServer()->getServer();
        foreach($fdList as $key=>$v){
            if(!empty($v)){
                $server->push((int)$v, $data);
            }
        }
        return Result::ACK;
    }
}

控制器代码

/**
 * test
 * @return array
 */
public function test()
{
    $data = array(
        'code' => 200,
        'data' => [
            'userOutName' => 'ccflow',
            'userOutNum' => '9999',
            'recordOutTime' => date("Y-m-d H:i:s", time()),
            'doorOutName' => '教师公寓',
        ]
    );
    $data = \GuzzleHttp\json_encode($data);
    $message = new DemoProducer($data);
    $producer = ApplicationContext::getContainer()->get(Producer::class);
    $result = $producer->produce($message);
    var_dump($result);
    $user = $this->request->input('user', 'Hyperf');
    $method = $this->request->getMethod();
    return [
        'method' => $method,
        'message' => "{$user}.",
    ];
}

最终效果

Hyperf+RabbitMQ+WebSocket实现大屏幕消息推送_第2张图片

回复「进群」即可进入无广告技术交流群。同时送上250本电子书+学习视频作为见面 有你想看的精彩 



秀!这款工具让SpringBoot不再需要Controller、Service、DAO、Mapper!
Linux 自带神器 logrotate 详解
HTTP/3 来了 !HTTP/2 还没怎么用起来呢,先一起扫个盲吧!
代码优化的 5 大原则,第 1 条相信你一开始就没想到!
Java 中 HashMap 中的容量与扩容实现
99 道 Java 多线程面试题
注意,Fastjson 最新高危漏洞又来了!
当IntelliJ IDEA2020.1遇上JDK14:所有美好环环相扣
这么多编程学习网站,总有一个适合你吧
一文搞定分布式系统ID生成方案
目前5000+ 人已关注加入我们
              

你可能感兴趣的:(Hyperf+RabbitMQ+WebSocket实现大屏幕消息推送)