首先下載下傳workman 然後啟動 https://www.workerman.net/web-sender
輕按兩下下圖示注檔案

啟動成功如下圖
web端代碼 (我這裡用到了layui 的notice元件)
<script src='/admin/layuiadmin/socket.js'></script>
<script>
layui.config({
base: '/admin/layuiadmin/' //靜态資源所在路徑
}).extend({
index: 'lib/index' //主入口子產品
}).use(['notice', 'index'],function () {
var notice = layui.notice;
var layer = layui.layer;
var $ = layui.jquery;
// 初始化配置,同一樣式隻需要配置一次,非必須初始化,有預設配置
notice.options = {
closeButton: true,//顯示關閉按鈕
debug: false,//啟用debug
positionClass: "toast-top-right",//彈出的位置,
showDuration: "300",//顯示的時間
hideDuration: "1000",//消失的時間
timeOut: "2000",//停留的時間
extendedTimeOut: "1000",//控制時間
showEasing: "swing",//顯示時的動畫緩沖方式
hideEasing: "linear",//消失時的動畫緩沖方式
iconClass: 'toast-info', // 自定義圖示,有内置,如不需要則傳空 支援layui内置圖示/自定義iconfont類名
onclick: null, // 點選關閉回調
};
// 連接配接服務端,workerman.net:2120換成實際部署web-msg-sender服務的域名或者ip
var socket = io('127.0.0.1:2120'); //http://www.tp5_test.com換成自己的域名或者ip
// uid可以是自己網站的使用者id,以便針對uid推送以及統計線上人數,這個ID可以随便寫
uid = '{{admin_info()["id"]}}';
// socket連接配接後以uid登入
socket.on('connect', function () {
socket.emit('login', uid);
});
<!-- 後端推送來消息時-->
socket.on('new_msg', function (msg) {
console.log(msg+'msg');
notice.success("API調用發來的消息!");
});
// 後端推送來線上資料時
socket.on('update_online_count', function (online_stat) {
console.log(online_stat);
});
});
</script>
服務端代碼
public function send_workman($id)
{
$to_uid = ''; //和頁面的uid一緻,不填寫也可以
// 推送的url位址,使用自己的伺服器位址
$push_api_url = "127.0.0.1:2121";
$post_data = array(
"type" => "publish",
"content" => $id,
"to" => $to_uid,
);
$ch = curl_init ();
curl_setopt ( $ch, CURLOPT_URL, $push_api_url );
curl_setopt ( $ch, CURLOPT_POST, 1 );
curl_setopt ( $ch, CURLOPT_HEADER, 0 );
curl_setopt ( $ch, CURLOPT_RETURNTRANSFER, 1 );
curl_setopt ( $ch, CURLOPT_POSTFIELDS, $post_data );
curl_setopt ( $ch, CURLOPT_HTTPHEADER, array("Expect:"));
$return = curl_exec ( $ch );
curl_close ( $ch );
var_export($return);
}
建立路由通路檢視效果
大概就是這個意思,描述的不是很清楚