PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > 开发编程 > Laravel教程 > 正文

    Laravel基于Pusher驱动的事件广播(第一篇)

    作者:admin来源:网络浏览:时间:2017-08-12 16:20:15我要评论
    分享到
    导读:1.1 Pusher是什么?Pusher是客户端和服务器之间的实时中间层,通过WebSocket或HTTP来和客户端实现持久链接,这样服务端可以实时向客户端发...
    1.1 Pusher是什么?

    Pusher是客户端和服务器之间的实时中间层,通过WebSocket或HTTP来和客户端实现持久链接,这样服务端可以实时向客户端发送数据。总之,就是一个实现持久链接的包。

    1.2 Pusher用途

    (一) 通知(Notification)/信号(Signal)
    通知是最简单的示例,也最经常用到。信号也可看作是通知的一种展现形式,只不过信号没有UI而已。

    (二) Activity Streams
    Activity Streams(feeds)是社交网络的核心。如微信朋友圈的点赞和评论,A可以实时看到B的点赞,B可以实时看到A的评论。

    (三) 实时数据可视化
    如在dashboard数据面板中实时显示投票数,或者实时显示天气情况等等。

    (四) 聊天
    聊天信息的实时显示,如微信。等等。具体可看Pusher Use Cases

    2. Pusher主要内容

    2.1 注册Pusher账号

    注册Pusher账号:可以在这里注册:pusher 注册,注册账号主要是为了获得appid,secret和key这三个认证密钥,同时注册后进入个人页面后,可以使用Pusher的Pusher Debug Console来查看接口调用情况。

    Laravel基于Pusher驱动的事件广播(第一篇)

    Laravel基于Pusher驱动的事件广播(第一篇)

    2.2 Laravel程序安装

    安装教程这里就不讲解了,不会的看这里:laravel安装

    2.3 配置Pusher认证密钥

    在项目根目录的.env文件中加入密钥,把刚刚获得的密钥换成你自己的就行,.env文件是Laravel项目配置文件:

    1. PUSHER_APP_ID=YOUR_APP_ID 
    2. PUSHER_KEY=YOUR_APP_KEY 
    3. PUSHER_SECRET=YOUR_APP_SECRET 
    然后,把Pusher集成到Laravel的后端,有两种方式:使用Laravel Pusher Bridge;使用Laravel Event Broadcaster。

    2.4 Laravel Pusher Bridge

    PHP包资源库中查找pusher,安装:

    1. composer require vinkla/pusher 
    安装完后注册下服务,service provider主要就是把刚刚下载的service(包)在Laravel容器中注册下,每一个service(包)都有对应的一个service privider:

    1. Vinkla\Pusher\PusherServiceProvider::class
    并同时把这个包的配置文件复制到config文件夹下,config文件夹下多了一个pusher.php文件:

    1. php artisan vendor:publish 
    在config/pusher.php文件中更新下配置文件:

    1. 'connections' => [ 
    2.  
    3.     'main' => [ 
    4.         'auth_key' => env('PUSHER_KEY'), 
    5.         'secret' => env('PUSHER_SECRET'), 
    6.         'app_id' => env('PUSHER_APP_ID'), 
    7.         'options' => [], 
    8.         'host' => null
    9.         'port' => null
    10.         'timeout' => null
    11.     ], 

    这里有一个安装bug:如果同时也在config/app.php中配置了Facade的话会报错,所以不用配置。可以使用IlluminateSupportFacadesApp::make('pusher')来从Laravel的Container容器中取出Pusher服务。一般可以用Facade从容器中取出服务,但这个包不好使,有bug。

    下面这句不用加在 config/app.php 中 aliases[] 数组中。

    1. 'Pusher' => Vinkla\Pusher\Facades\Pusher::class 
    配置并安装好这个包后就来检测下能不能使用:

    1. get('/ceshi'function() { 
    2.     $pusher = \Illuminate\Support\Facades\App::make('pusher'); 
    3.  
    4.     $pusher->trigger( 'test-pusher'
    5.                       'test-event'
    6.                       ['text' => 'www.bcty365.com  B5教程网'
    7.                     ); 
    8.                return '这个是pusher测试'
    9. }); 
    在浏览器上访问http://demo.app/ceshi (本地hosts里配置的本地域名),正确返回【这个是pusher测试】,说明pusher已经触发。可以在Pusher Debug Console后台查看是否触发:

    Laravel基于Pusher驱动的事件广播(第一篇)

    2.5 Laravel Event Broadcaster

    Laravel5.1以后提供了Event Broadcaster功能,配置文件是config/broadcasting.php,并且默认驱动是pusher:'default' => env('BROADCAST_DRIVER', 'pusher'),如果不是可以在.env文件中添加BROADCAST_DRIVER=pusher。总之,不需要修改啥配置了。broadcasting.php中也是要读取pusher的密钥:

    1. 'connections' => [ 
    2.  
    3.         'pusher' => [ 
    4.             'driver' => 'pusher'
    5.             'key' => env('PUSHER_KEY'), 
    6.             'secret' => env('PUSHER_SECRET'), 
    7.             'app_id' => env('PUSHER_APP_ID'), 
    8.             'options' => [ 
    9.                 // 
    10.             ], 
    11.         ], 
    12.         ... 
    既然事件广播,那就需要生成事件和对应的监听器,在app/Providers/EventServiceProvider.php中写入任何一个事件名称如SomeEvent,和对应的监听器如EventListener:

    1. protected $listen = [ 
    2.         'App\Events\PusherEvent' => [ 
    3.             'App\Listeners\PusherEventListener'
    4.         ], 
    5.     ]; 
    然后在项目根目录生成事件和对应的监听器:

    php artisan event:generate
    Laravel中事件如果需要广播,必须实现Illuminate\Contracts\Broadcasting\ShouldBroadcast接口,并且事件中public属性都会被序列化作被广播的数据,即public属性数据会被发送。同时,还需要在broadcastOn()函数中写入任意字符的广播频道:

    1. class PusherEvent extends Event implements ShouldBroadcast 
    2.     use Dispatchable, InteractsWithSockets, SerializesModels; 
    3.  
    4.     public $text, $id; 
    5.  
    6.     /** 
    7.      * Create a new event instance. 
    8.      * 
    9.      * @return void 
    10.      */ 
    11.     public function __construct($text, $id) 
    12.     { 
    13.         $this->text = $text; 
    14.         $this->id   = $id; 
    15.     } 
    16.  
    17.     /** 
    18.      * Get the channels the event should broadcast on. 
    19.      * 
    20.      * @return Channel|array 
    21.      */ 
    22.     public function broadcastOn() 
    23.     { 
    24.        // return ['laravel-broadcast-channel']; 
    25.         return new PrivateChannel('channel-name-bcty365'); 
    26.     } 
    好,然后触发这个事件,为了简单,就直接在路由中触发:

    1. Route::get('/broadcast'function () { 
    2.     event(new \App\Events\PusherEvent('B5教程网-www.bcty365.com ''1')); 
    3.     return 'Laravel Broadcaster测试功能'
    4. }); 

    2.6 Laravel Pusher Bridge vs Laravel Event Broadcaster

    使用Laravel Pusher Bridge可以不必被Event Broadcaster的一些规则束缚,并且可以通过pusher实例来获取Pusher提供的其他服务如验证频道订阅,查询程序状态等等。不过使用Laravel Event Broadcaster可以实现模块解耦,当有其他的更好的push包时可以快速切换别的服务。可以选择适合的方法。

    2.7 使用Pusher JavaScript包

    既然服务端可以工作正常了,那现在开始研究下客户端来接收事件触发时服务端发送来的数据。可以新建一个view,或者直接使用已有的welcome.blade.php这个view,但先把这个文件的 https://fonts.googleapis.com/... 注销掉免得每次加载有些慢。在文件中写入代码:

    1. <script src="//js.pusher.com/3.0/pusher.min.js"></script> 
    2. <script> 
    3. var pusher = new Pusher("{{env("PUSHER_KEY")}}"
    4. var channel = pusher.subscribe('test-pusher'); 
    5. channel.bind('test-event'function(data) { 
    6.   console.log(data); 
    7.   console.log(data.text); 
    8. }); 
    9. </script> 

    先加载pusher的js包,再利用pusher对象去订阅频道,再用频道绑定触发事件,闭包返回接收到的数据。这里订阅Laravel Pusher Bridge里写的test-channel频道,绑定test-event事件,打印text属性的数据,我们知道上文中我们写入了数据为['text' => 'www.bcty365.com  B5教程网'],那客户端打印的数据应该是'www.bcty365.com  B5教程网',看看是不是,在两个标签页面间切换看看打印的数据。A页面触发事件B页面能接收到数据;B页面触发事件A页面接收到数据。

    2.8 调试Pusher JavaScript客户端

    可以使用Pusher Debug Console控制面板查看触发情况,当然可以在客户端打印调试信息:

    1. <script> 
    2.             Pusher.log = function(msg) { 
    3.                 console.log(msg); 
    4.             }; 
    5.             var pusher = new Pusher("{{env("PUSHER_KEY")}}"); 
    6.             var channel = pusher.subscribe('test-pusher'); 
    7.             ... 

    看打印信息知道,开始是connecting,然后连接成功connected,然后频道订阅成功subscription_succeeded,最后事件也被接收且数据也发送成功Event recd。

    转载请注明(B5教程网)原文链接:http://www.bcty365.com/content-153-5914-1.html
    相关热词搜索: Laravel事件广播 Pusher驱动
    网友评论: