laravel 5.5 广播(broadcast)的配置及使用

Posted fogwu

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了laravel 5.5 广播(broadcast)的配置及使用相关的知识,希望对你有一定的参考价值。

借助Laravel Broadcasting你可以使用上时下很热的Websocket技术。

注意:请务必使用较新版本的 Laravel。Laravel在最近几个版本进行过比较大的重构,比如路由从 app\\Http\\routes.php 拆分为到 routes 目录下的多个文件,包括广播在内的各个附加组件也都进行了重构并正式写入文档。所以网上有些教程(特别是入门教程)可能是根据旧版本来写的,容易让你迷惑。当安装完Laravel后执行以下命令查看Laravel版本

php artisan --version
如果低于 5.4 请重新建立新版本的Laravel,具体方法在下面会详细讲解。

 

实例背景:
假设场景:
假设我们要使用laravel作为服务端做一个新闻推送系统。用户打开页面后不需要刷新页面即可不断的获取到最新的新闻。

环境参数
Homestead 7.4.2
Laravel 5.5 (广播机制在 5.4 以后进行了一次重构,并正式加入文档,所以请务必使用 5.4 及其以上版本)
PHP 7.1
Redis 4.0.9 (Homestead 自带redis)
————————————————

广播架构
目前有两种广播机制可选:

pusher:laravel自带方案,但是有使用限制,需要收费
Redis + socket.io:无限制
我们使用业界较流行的Redis + socket.io 方案 。
接下来你会信息爆炸似的接收到好几个新名词:

laravel-echo-server:使用 socket.io 机制实现的 broadcasting 服务端
laravel-echo:laravel-echo是 laravel broadcasting 的客户端。注意,laravel-echo 并不是 laravel-echo-server 专属的客户端, laravel-echo 有两种连接机制可以选:pusher 和 socket.io 。 而 laravel-echo-server 是开发出来专门用于 socket.io连接的服务端。如果你使用的是 pusher,那么不需要使用 laravel-echo-server ,但是你依然要使用 laravel-echo
Socket.IO:websocket 的一种nodejs实现。laravel-echo 如果要使用socket.io 则需要先安装 socket.io-client。
Predis:redis客户端的php实现,如果要使用redis作为广播机制的实现,则需要先安装 predis
Laravel Event:广播事件类
Laravel Queue:广播机制是基于queue机制来实现的
Redis Sub/Pub:Redis的订阅机制。laravel-echo-server本质上只是一个Redis订阅服务的订阅者。
这几样东西配合起来的架构图如下

 

根据这幅图我们可以知道事件的广播机制流程:

Laravel 通过 broadcasting 机制发布一个Event对象到Redis
Laravel Queue Worker 读取该Event对象,并使用Redis的Sub/Pub机制将该 Event对象发布出去
laravel-echo-server  通过 Redis 的 Sub/Pub机制收听到该 Event
由于 laravel-echo 使用 socket.io 跟 laravel-echo-server相连接。所以 laravel-echo 会通过socket.io将Event对象发送给laravel-echo
laravel-echo解析通过 socket.io接收到的 Event对象
广播事件种类:

public:谁都可以收听的广播
private:只有指定用户可以收到的广播
presence:不仅可以收听到跟你有关的广播,还可以跟别的用户互动,适合做聊天室
我们假设的场景是新闻推送系统,所以使用最简单的public广播就可以实现。接下来我们详细的来讲解如何将这些组件配置好,并连接起来。

我们按照广播机制的流程来一步一步的设置广播机制。


1、注册 BroadcastServiceProvider,打开 config/app.php 找到 \'provides\' 属性,将 BroadcastServiceProvider 前的注释去掉

2、安装redis(不改动的情况下安装好后redis使用默认即可)

   

composer required predis/predis

3、配置.env文件

  

由于广播机制是基于queue机制实现的。所以queue的存储设置会直接决定广播事件的存储位置

BROADCAST_DRIVER=redis

设置queue为redis

QUEUE_DRIVER=redis

4、建立事件(event)

php artisan  make:event loginLogEvent

修改事件源码增加广播频道:

/*增加对 ShouldBroadcast 的实现*/

class loginLogEvent implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;
 
    public $message;
    /**
     * Create a new event instance.
     *
     * @return void
     */
    public function __construct($news_message)
    {
        $this->message = $news_message;
    }
 
    /**
     * Get the channels the event should broadcast on.
     *
     * @return \\Illuminate\\Broadcasting\\Channel|array
     */
    public function broadcastOn()
    {
        return new Channel(\'loginLogEvent\');
    }
}

5、增加广播路由(routes\\channels.php)

 

/*channel 方法接收两个参数:频道名称和一个回调函数,该回调通过返回 true 或者 false 来表示用户是否被授权监听该频道*/
Broadcast::channel(\'loginLogEvent\',function ($user,$id)
{
    return true;
});

6、测试广播:

   1)编辑 routes/console.php ,增加 bignews 命令:

        

/*自定义命令*/
Artisan::command(\'bignews\', function () {
    broadcast(new loginLogEvent(date(\'Y-m-d h:i:s A\').": BIG NEWS!"));
    $this->comment("news sent");})->describe(\'Send news\');

  2)测试命令:

       输入:php artisan bignews

     

   通过 redis-cli 查看当前redis中的数据,发现多出来一个queue对象,证明连接成功了,如果没有,请检查env配置中的queue配置是否正确

   你还你可以在queue worker的执行界面看到该Event已经被检测到,并通过Redis Sub/Pub机制传播出去了

   

7:安装并配置 laravel-echo-server

 1)安装

 
npm install -g laravel-echo-server

2)初始化 Socket 服务(切记在生产环境中,无论你什么时候使用它,都应该关掉你的开发者模式)

laravel-echo-server init

  

      它会帮你在项目根目录下生成 laravel-echo-server.json 

3)启动laravel-echo-server 

   

启动/停止

laravel-echo-server start/stop

启动后,在新打开一个终端窗口,输入 php artisan bignews 显示如下证明广播推送到了laravel-echo-server

 8:端口映射:

    因为laravel-echo-server使用的是 6001 端口,所以记得去 Homestead.yaml里面添加6001 端口的映射

   

  使用命令:vagrant reload 重载生效

 

9、浏览器收听广播

       1)安装组件
          

    

/*由于前端使用的是 laravel-echo来收听广播,我们选择的底层实现方式是socket.io。所以首先我们要在package.json中添加 laravel-echo 和 socket.io的依赖*/



npm i --save laravel-echo


npm i --save socket.io-client

  

      2)配置/resources/assets/js/bootstrap.js        

    

import Echo from \'laravel-echo\'
/*使用 pusher
window.Pusher = require(\'pusher-js\');

window.Echo = new Echo({
    broadcaster: \'pusher\',
    key: \'your-pusher-key\',
    cluster: \'mt1\',
    encrypted: true
 });
*/
/*使用 socket.io-client*/
window.io = require(\'socket.io-client\');

window.Echo = new Echo({
    broadcaster: \'socket.io\',
    host:window.location.hostname+\':6001\'
});

  

 

  3) 重新编译app.js 文件

 

   

    注意:*默认使用 http://registry.npmjs.org在国内不稳定,如果出现404错误,可切换使用国内镜像*

  npm config set registry=https://registry.npm.taobao.org

npm run dev

  

       4) 建立测试文件

            在resources\\views\\目录下新建boradcast.blade.php 文件,放入以下内容

            

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>News Room</title>
    <link href="{{ mix(\'css/app.css\') }}" rel="stylesheet">
</head>
<body>
<div class="content">
    News Room
</div>
<script src="{{ mix(\'js/app.js\') }}"></script>
<script>
    /*收听loginLogEvent通道内的loginLogEvent事件对象,将接收到的事件在控制台打印出来。*/
   Echo.channel(\'loginLogEvent\')
        .listen(\'loginLogEvent\', (e) => {
            alert(JSON.stringify(e));
            console.log(e.message);
        });
</script>
</body>

 5)在rotues/web.php 加入路由路径

         

Route::view(\'broadcast\',\'boradcast\');

 6)查看效果 

     启动步骤:打开一个命令窗口启动 :    laravel-echo-server start

      再打开一个窗口启动队列启动队列: php artisan queue:work 

      给队列加内容: php artisan bignews

  

         

 

    参考:https://blog.csdn.net/nsrainbow/article/details/80428769

    

以上是关于laravel 5.5 广播(broadcast)的配置及使用的主要内容,如果未能解决你的问题,请参考以下文章

如何解决 Laravel Broadcasts + Pusher..?

laravel 广播多后卫

laravel5.5事件广播系统

为啥 laravel 广播频道有默认前缀?

Laravel使用中的Broadcasting Events事件和Queues队列

Laravel Lumen + Broadcasting + Redis + Class pusher not found