Press "Enter" to skip to content

laravel5.5 + websocket 消息推送

安装依赖与配置

php 推送 SDK ) composer require pusher/pusher-php-server

  1. Pusher => Pusher\Pusher::class 添加到 provider
  2. 配置 .env QUEUE_DRIVER 为 redis, 以及 config/database redis 配置,(也可以使用其他队列驱动,这里仅 redis 举例)

  3. 修改配置 config/broadcasting 如下

'default' => env('BROADCAST_DRIVER', 'pusher'),
'pusher' => [
    'driver' => 'pusher',
    'key' => env('PUSHER_APP_KEY'),
    'secret' => null,
    'app_id' => env('PUSHER_APP_ID'),
    'options' => [
        'host' => 'localhost',
        'port' => 6001,
    ],
]

ps:PUSHER_APP_KEY,PUSHER_APP_ID 在 laravel-echo-server.json 文件中自取

WbSocket 服务端)npm install -g laravel-echo-server

laravel-echo-server init 初始化配置,该配置可到根目录下 laravel-echo-server.json 查看和修改

订阅频道和监听的 js 库) npm install laravel-echo –save

resources/assets/js/bootstrap.js 加入如下代码

import Echo from "laravel-echo"
window.Echo = new Echo({
    broadcaster: 'socket.io',
    host: window.location.hostname + ':6001'
});

使用 npm run dev 进行编译,并把编译好的 public/js/app.js 引入视图

事件和监听器

文档参考

可在 App\Providers\EventServiceProvider listen 属性中绑定事件和监听器,然后运行 php artisan make:event:generate 自动生成事件和监听类文件,注意 事件类必须实现 ShouldBroadcast 接口

前端监听

  1. 视图加入 <meta name="csrf-token" content="{{ csrf_token() }}">
  2. 视图加入 <script src="//{{ Request::getHost() }}:6001/socket.io/socket.io.js"></script>
  3. 添加如下 js 代码
// 频道 `notice` 是 `App\Events\FooBroadcastingEvent` 事件类 broadcastOn 方法设置值
// `FooBroadcastingEvent` 事件名( 类名 )
Echo.channel('notice').listen('FooBroadcastingEvent', (e) => {  
    // todo 
});

启动服务

  1. WebSocket 服务)laravel-echo-server start
  2. 队列监听)php artisan queue:listen
  3. 可以通过 event() 函数触发事件推送

Be First to Comment

发表评论

电子邮件地址不会被公开。 必填项已用*标注