简体   繁体   English

Laravel echo:是否可以监听所有事件而不是特定事件?

[英]Laravel echo: is it possible to listen to all events instead of a specific one?

I have implemented Laravel Broadcasting in my project.我在我的项目中实现了 Laravel 广播。 Everything is working fine but I'm wondering if it's possible to listen to all events instead of just a specific one?一切正常,但我想知道是否可以收听所有事件,而不仅仅是一个特定的事件?

Currently I have this code on my front-end:目前我的前端有这段代码:

window.Echo.channel('office-dashboard')
  .listen('CompanyUpdated', (e) => {
    console.log(e.company);
  });
  .listen('CompanyDeleted', (e) => {
    console.log(e.company);
  });

I want to structure my event in such a way that I can grab what kind of event it exactly was, and what kind of action was performed.我想以这样一种方式来构建我的事件,以便我可以抓住它到底是什么类型的事件,以及执行了什么样的操作。 But that's useless if I still have to listen to each event specifically, like I do now.但如果我仍然必须像现在这样专门收听每个事件,那将毫无用处。 I want to listen to all events in a channel, is that possible?我想收听一个频道中的所有事件,可以吗?

I read the docs , but those only talk about how to listen to a specific event.我阅读了 文档,但那些只讨论了如何收听特定事件。

I came across the same situation.我遇到了同样的情况。 I think you need to listen to individual channels.我认为您需要收听各个频道。 but you can write the code a bit cleaner like below.但是您可以像下面那样编写更简洁的代码。

    const channel = window.Echo.channel('office-dashboard')

    const eventsTolisten = [
      'CompanyUpdated',
      'CompanyDeleted',
    ]

    eventsTolisten.forEach(event => {
      channel.listen(event, e => {
        this.handleSocketEvents({
          name: event,
          data: e.data
        })
      })
    })

If you are using pusher as your broadcast driver, you have access to a listenToAll() method from your Laravel Echo instance.如果你使用 pusher 作为你的广播驱动程序,你可以从你的 Laravel Echo 实例访问一个listenToAll()方法。 In short, you may do the following to listen for all events on a specific channel:简而言之,您可以执行以下操作来侦听特定频道上的所有事件:

Echo.private(`office-dashboard`)
   .listenToAll((event, data) => {
      // do what you need to do based on the event name and data
      console.log(event, data)
   });

The listenToAll() method just takes a single argument, a callback, which will receive the name of the event as the first parameter and any data associated with the event as a second parameter. listenToAll()方法只接受一个参数,一个回调,它将接收事件的名称作为第一个参数和与事件相关的任何数据作为第二个参数。

I have implemented Laravel Broadcasting in my project.我已经在我的项目中实现了Laravel Broadcasting。 Everything is working fine but I'm wondering if it's possible to listen to all events instead of just a specific one?一切工作正常,但我想知道是否可以听所有事件而不是仅听一个特定事件?

Currently I have this code on my front-end:目前,我的前端有以下代码:

window.Echo.channel('office-dashboard')
  .listen('CompanyUpdated', (e) => {
    console.log(e.company);
  });
  .listen('CompanyDeleted', (e) => {
    console.log(e.company);
  });

I want to structure my event in such a way that I can grab what kind of event it exactly was, and what kind of action was performed.我想以这样一种方式来组织事件,使我可以掌握事件的确切类型以及所执行的操作。 But that's useless if I still have to listen to each event specifically, like I do now.但这没什么用,如果我仍然必须像现在一样专门听每个事件。 I want to listen to all events in a channel, is that possible?我想收听频道中的所有事件,这可能吗?

I read the docs , but those only talk about how to listen to a specific event.我读了 文档,但是那些只谈论如何收听特定事件。

Yes it is possible, I just implemented it on my app 5 minutes ago.是的,这是可能的,我 5 分钟前刚刚在我的应用程序上实现了它。 Use the broadcastAs in all your events, as described here:在所有事件中使用 broadcastAs,如下所述:

https://laravel.com/docs/8.x/broadcasting#broadcast-name https://laravel.com/docs/8.x/broadcasting#broadcast-name

Then you can include the name of the event using the broadcastWith function:然后你可以使用 broadcastWith 函数包含事件的名称:

https://laravel.com/docs/8.x/broadcasting#broadcast-data https://laravel.com/docs/8.x/broadcasting#broadcast-data

--- server side --- --- 服务器端 ---

public function broadcastWith()
{
    return[
        'id' => 'RoomJoined',
        'message' => 'new user joined the room!'
    ];
}

public function broadcastAs()
{
    return 'event';
}

--- client side --- --- 客户端 ---

window.Echo.channel(this.channel).listen(".event", response => {
  console.log(response);
});

To differentiate between the events you could either use an if statement in the listener or pass a function name to call directly, pros and cons to each.为了区分事件,您可以在侦听器中使用 if 语句或传递函数名称以直接调用,优缺点。

In listen method, pass ' * ' as the event name.在 listen 方法中,传递 ' * ' 作为事件名称。

window.Echo.channel('office-dashboard').listen('*', (e) => {
   console.log(e.company);
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM