workerman 实现推送实时数据到前端

2024-05-16 08:28

本文主要是介绍workerman 实现推送实时数据到前端,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

首先要说明一下,实时推送是有两个socket服务端和两个socket的客户端
我们分别起名叫做
外层服务端 (开启服务主进程 创建一个 websoket 连接)ws://
内层服务端 (在开户主进程的时候,内部又创建的一个 socket)text://
外层客户端 (这是由前端的用户端 使用js 创建的一个 websocket 客户端)
内层客户端 (这是php 使用 stream_socket_client 创建的一个客户端)

上代码(说明在代码的注释中)
服务端代码 (websocket 的创建)

  1. 安装 workerman (因为使用的是 tp框架,所以安装的 topthink/think-worker ,它已经包含了 workerman)
composer install topthink/think-worker

这个服务端是一个 挂起的操作, 所以不需要过 tp 的入口文件,直接使用 php 命令行运行就可以了
本人在 app\worker\Testworker.php 新建了这个服务端的文件

require __DIR__ . '/../../vendor/autoload.php';   //因为是独立运行的,所以要引入 autoload.php
use Workerman\Worker;
$worker = new Worker("websocket://0.0.0.0:2345");   //创建了一个 websocket 的服务端,端口是 2345 (记得打开阿里云 或 宝塔的 2345端口)
$worker->count=1; //count属性windows中的配置就写1  linux中可以配多个$worker->uidConnections = [];  //自定义了一个空数组,用来存放所有的 连接对象//当连接成功时
$worker->onConnect = function($connection){dump($connection);//这里只是显示一下连接是否成功,没有什么作用
};//workerman 收到消息时的监听,前端可能发过来不同种类的消息,所以消息上都带有type字段,根据 type 类型的不同做相应的处理
//参数 $connection 表示 这个 websocket连接的资源操作符 是一个非常有用的数据后续我们是在保存起来的
//参数 $msg 就是前端发过来的数据 格式是 {type:"bind",uid:1},自已定义就可以了 我这里bind就是绑定用户的意思
$worker->onMessage = function($connection,$msg) use ($worker){$msg = json_decode($msg,true);if($msg["type"] == "bind"){//如果前端传来的消息类型是 bind 就是绑定用户的消息类型if(!isset($connection->uid)){$connection->uid = $msg["uid"];  //我们给 $connection对象加上一个uid属性 这一步用户不太大}$worker->uidConnections[$connection->uid] = $connection;  //这里把所有客户端的连接放入一个数组中, 并使用 用户的uid 做为键名,当要发送信息的时候,就通过 uid 得到用户相对应的 connection }else if($msg["type"] == "logout"){//如果前端传来的消息类型是 logout 就从uidConnections中删除 相应的connectionunset($worker->uidConnections[$msg["uid"]]);}//这里根据消息类型的不同可以写很多的 if 分支
};//当服务端关闭的时候,给每一个客户端发送 服务器下线的通知
$worker->onClose = function() use ($worker){foreach($worker->uidConnections as $uidConnection){$uidConnection->send("服务器下线了");}
};//当服务启动时
$worker->onWorkerStart = function($worker){
//当服务启动时, 我们在内部开启一个socket  也就是上面说的 内层服务端 端口是2346 记得打开(阿里云或宝塔的端口)
//这里的 innerSocket是给 php 开启的 socket 的客户端来使用的$innerSocket = new Worker("text://0.0.0.0:2346");$innerSocket->onMessage = function($connection,$innermsg) use($worker){//在innermesg 中包含的有数据 {type:"notify",uids:[1,2,4,5],data:{.....}}  类型和要接收通知的用户的id$innermsgArr = json_decode($innermsg,true);if($innermsgArr["type"] == "notify"){//如果消息类型是 notify ,就从 $worker->uidConnections中取出相对应用户的连接对象,使用send方法把数据发送给前端foreach($innermsgArr["uids"] as $uid){$worker->uidConnections[$uid]->send($innermsgArr["data"]);}}}//workerman允许在服务运行过程中调用new Worker实例化Worker建立监听其它端口。此时因为已经在运行,所以不需要调用run方法,直接调用listen方法,将新的监听add到EventLoop中即可。$innserSocket->listen();   //上面解释了这里为什么要使用 listen方法
}Worker::runAll();  //这是workerman 启动服务的方法

以上就是 服务端的代码, 使用时 在命令行中 php Testwroker.php就可以了, 它是一个挂起的窗口,我们实际上线时可以让它在后台运行就可以了


前端(用户端) 客户端 socket的使用 这里我使用的是vue3 不用安装就直接使用js 原生的websocket ,开发工具写的时候可能为 自动给你添加了别了 websocket类,注意把开发工具添加的 import …websocket 这行给删除掉
上代码

<template><div class="wrapper"><h5>这是一个websocket 的测试的例子</h5><div>{{backdata}}</div></div>
</template><script setup>import {onMounted, ref} from "vue";let websocket = ref();let backdata = ref("xxxxx");  //后端发回过来的数据onMounted(()=>{//前端创建一个websocket客户端,并建接到 外层服务端 2345 的端口websocket.value = new WebSocket("ws://127.0.0.1:2345")websocket.value.onopen = ()=> {console.log("建立连接");//当连接建立成功之后, 就给服务端发送一个绑定的消息,其中 uid 是用户登录的时候就已经获取到的, 样例这里我是写死的 为1websocket.value.send(JSON.stringify({type:"bind",uid:1}))}//当后端给前端发送消息时websocket.value.onmessage = (event) =>{console.log(event);console.log(event.data);  //这里的data 也可以 分为不同的类型, 也就是说在服务端返回数据的时候加上 type 自定义一下就可以了,根据类型的不同来前端显示不同的数据backdata.value = event.data;}websocket.value.onclose  = ()=> {console.log("连接关闭")}})</script>

php 的创建的客户端的用法
当我们后端改动数据库之后, 给前端发送一个信息
我们在 自已的业务中 api 添加一个接口

<?php
namespace app\api\controller;use app\common\controller\Frontend;
use utils\WechatUtil;
class Order extends Frontend{protected array $noNeedPermission = ["*"];protected array $noNeedLogin = ["*"];//我们的 api 测度接口public function workerMantest(){/*** 这里有一些修改数据库的代码 根据业务的不同写上就可以了* 完成了数据库的操作之后* 下面要用 php 新建一个 socket的客户端,去连接  innerworker 的服务端,并传输一些数据*///这里使用 stream_socket_client创建了一个 socket 的资源, 为什么要用它,后面再说$client = stream_socket_client("tcp://127.0.0.1:2346",$error,$errmsg,10);if(!$client){echo $errmsg;  //如果报错返回错误信息}else{$result = ["type"=>"notify","uids"=>[1],   // 这里是 哪些用户需要被推送消息"data"=>"这里是想发送给 用户客户端的一些数据"];$resultjson = json_encode($result);  //2346 socket开的是 text://   协议   text协议,要求在文本最后加上 \n 为结束标记fwrite($client, $resultjson."\n");//fread($client,strlen($resultjson."\n"));  这里的 fread就不需要了, 没用,而耗时fclose($client);   //完成关闭资源}return $this->succcess("订单修改成功");}
}

最后在这里说明一下, 为什么 在 php 客户端中使用的是 stream_socket_client 函数创建的,而不是用 workerman 来创建客户端, 我们知道 workerman 也可以创建客户端,也可以创建服务端, 那么我们为什么没有 在 api 接口中,使用workerman 创建客户端呢???

主要是因为 api接口和 workerman 运行的环境不同
api接口,我们是运行在 php-fpm 的环境中的
workerman 是运行在 命令行中的,不能在 php-fpm 中使用

退一步想,我们 api接口运行完成,就返回数据了, 如果在其中使用 workerman的话,这个接口就会一直挂起

所以 我们 使用了 stream_socket_client 创建了 php 端的 socket

这篇关于workerman 实现推送实时数据到前端的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/994383

相关文章

Vue3 的 shallowRef 和 shallowReactive:优化性能

大家对 Vue3 的 ref 和 reactive 都很熟悉,那么对 shallowRef 和 shallowReactive 是否了解呢? 在编程和数据结构中,“shallow”(浅层)通常指对数据结构的最外层进行操作,而不递归地处理其内部或嵌套的数据。这种处理方式关注的是数据结构的第一层属性或元素,而忽略更深层次的嵌套内容。 1. 浅层与深层的对比 1.1 浅层(Shallow) 定义

大模型研发全揭秘:客服工单数据标注的完整攻略

在人工智能(AI)领域,数据标注是模型训练过程中至关重要的一步。无论你是新手还是有经验的从业者,掌握数据标注的技术细节和常见问题的解决方案都能为你的AI项目增添不少价值。在电信运营商的客服系统中,工单数据是客户问题和解决方案的重要记录。通过对这些工单数据进行有效标注,不仅能够帮助提升客服自动化系统的智能化水平,还能优化客户服务流程,提高客户满意度。本文将详细介绍如何在电信运营商客服工单的背景下进行

基于MySQL Binlog的Elasticsearch数据同步实践

一、为什么要做 随着马蜂窝的逐渐发展,我们的业务数据越来越多,单纯使用 MySQL 已经不能满足我们的数据查询需求,例如对于商品、订单等数据的多维度检索。 使用 Elasticsearch 存储业务数据可以很好的解决我们业务中的搜索需求。而数据进行异构存储后,随之而来的就是数据同步的问题。 二、现有方法及问题 对于数据同步,我们目前的解决方案是建立数据中间表。把需要检索的业务数据,统一放到一张M

这15个Vue指令,让你的项目开发爽到爆

1. V-Hotkey 仓库地址: github.com/Dafrok/v-ho… Demo: 戳这里 https://dafrok.github.io/v-hotkey 安装: npm install --save v-hotkey 这个指令可以给组件绑定一个或多个快捷键。你想要通过按下 Escape 键后隐藏某个组件,按住 Control 和回车键再显示它吗?小菜一碟: <template

关于数据埋点,你需要了解这些基本知识

产品汪每天都在和数据打交道,你知道数据来自哪里吗? 移动app端内的用户行为数据大多来自埋点,了解一些埋点知识,能和数据分析师、技术侃大山,参与到前期的数据采集,更重要是让最终的埋点数据能为我所用,否则可怜巴巴等上几个月是常有的事。   埋点类型 根据埋点方式,可以区分为: 手动埋点半自动埋点全自动埋点 秉承“任何事物都有两面性”的道理:自动程度高的,能解决通用统计,便于统一化管理,但个性化定

【 html+css 绚丽Loading 】000046 三才归元阵

前言:哈喽,大家好,今天给大家分享html+css 绚丽Loading!并提供具体代码帮助大家深入理解,彻底掌握!创作不易,如果能帮助到大家或者给大家一些灵感和启发,欢迎收藏+关注哦 💕 目录 📚一、效果📚二、信息💡1.简介:💡2.外观描述:💡3.使用方式:💡4.战斗方式:💡5.提升:💡6.传说: 📚三、源代码,上代码,可以直接复制使用🎥效果🗂️目录✍️

使用SecondaryNameNode恢复NameNode的数据

1)需求: NameNode进程挂了并且存储的数据也丢失了,如何恢复NameNode 此种方式恢复的数据可能存在小部分数据的丢失。 2)故障模拟 (1)kill -9 NameNode进程 [lytfly@hadoop102 current]$ kill -9 19886 (2)删除NameNode存储的数据(/opt/module/hadoop-3.1.4/data/tmp/dfs/na

异构存储(冷热数据分离)

异构存储主要解决不同的数据,存储在不同类型的硬盘中,达到最佳性能的问题。 异构存储Shell操作 (1)查看当前有哪些存储策略可以用 [lytfly@hadoop102 hadoop-3.1.4]$ hdfs storagepolicies -listPolicies (2)为指定路径(数据存储目录)设置指定的存储策略 hdfs storagepolicies -setStoragePo

Hadoop集群数据均衡之磁盘间数据均衡

生产环境,由于硬盘空间不足,往往需要增加一块硬盘。刚加载的硬盘没有数据时,可以执行磁盘数据均衡命令。(Hadoop3.x新特性) plan后面带的节点的名字必须是已经存在的,并且是需要均衡的节点。 如果节点不存在,会报如下错误: 如果节点只有一个硬盘的话,不会创建均衡计划: (1)生成均衡计划 hdfs diskbalancer -plan hadoop102 (2)执行均衡计划 hd

【前端学习】AntV G6-08 深入图形与图形分组、自定义节点、节点动画(下)

【课程链接】 AntV G6:深入图形与图形分组、自定义节点、节点动画(下)_哔哩哔哩_bilibili 本章十吾老师讲解了一个复杂的自定义节点中,应该怎样去计算和绘制图形,如何给一个图形制作不间断的动画,以及在鼠标事件之后产生动画。(有点难,需要好好理解) <!DOCTYPE html><html><head><meta charset="UTF-8"><title>06