1、所需安装
(1) composer require pusher/pusher-php-server
(2) npm install -g laravel-echo-server
注: 需执行npm config set registry https://registry.npmjs.org/
将npm镜像修改为国外镜像
2、初始化laravel-echo-server
执行 laravel-echo-server init 初始化laravel-echo-server服务
3、修改初始化生成的laravel-echo-server.json文件
(1) authHost 修改为当前服务器域名或IP
(2) 检查Port 端口是否正确
4、注册laravel的广播服务
(1) Config 文件夹下的 app.php,取消BroadcastServiceProvider 在这个 Providers 数组中的注释
5、修改.env 文件
(1) PUSHER_APP_ID修改为laravel-echo-server.json里的clients数组内的appid
(2) PUSHER_APP_KEY修改为laravel-echo-server.json里的clients数组内的key
(3) BROADCAST_DRIVER修改为laravel-echo-server.json里的database对应的数据
6、修改广播配置(config文件夹下的broadcasting.php)
1、检查默认的驱动方式是否为env的BROADCAST_DRIVER配置项
2、检查connections数组下的pusher数组内的key与appid的值是否从.Env读取
7、修改config下的database.php
(1) 将redis下的options下的prefix修改为空
8、在app文件夹下Providers文件下的EventServiceProvider文件内的listen属性内创建OrderShipped 事件和相关的监听器。
例:
protected $listen = [
'App\Events\OrderShipped' => [ // OrderShipped 为事件,
'App\Listeners\SendShipmentNotification',
//SendShipmentNotification 为监听器
],
];
(点击此处查看事件系统文档)
然后项目中执行php artisan event:generate命令,系统会自动创建相关的事件文件和监听器文件。
广播事件OrderShipped必须继承ShouldBroadcast接口(事件名称可随意定义,但需有前端监听的事件名称一致)
9、修改OrderShipped事件内的broadcastOn方法
(1) 修改为 return new Channel('orderStatus');
此为定义广播频道,括号内的字符串为广播频道名称
广播频道需与前端监听的频道名称保持一致
10、若需携带参数则可使用broadcastWith方法
public function broadcastWith(){
return [
'data' => 'key'
];
}
11、需要调用广播时通过event方法调用广播事件即可
(1) 例: event(new OrderShipped($id));
12、在服务器执行laravel-echo-server start 启动广播服务
Laravel广播系统前端配置
1、安装npm包
(1) npm install --save laravel-echo pusher-js
(2) npm install socket.io-client --save
2、文件中引入包
(1) import io from 'socket.io-client'
(2) import Echo from 'laravel-echo'
3、调用代码
window.Echo = new Echo({
broadcaster: 'socket.io',
host: '192.168.0.200:6001' // socket服务器代码
});
window.Echo.channel(`orderStatus`) // 广播频道名称
.listen('OrderShipped', (e) => { // 消息名称 (后端事件名称)
console.log(e); // 收到消息进行的操作,参数 e 为所携带的数据
});