Realtime with Laravel Reverb
Playing
11. Listening to multiple events

Episodes

0%
Your progress
  • Total: 1h 19m
  • Played: 0m
  • Remaining: 1h 19m
Join or sign in to track your progress

Transcript

00:00
So far within Echo, we've only been listening to a single event, but we can actually listen to multiple events on a specific channel. Let's go ahead and create out another event to signify when order has been delivered. So let's make out an event here and we'll call this order delivered.
00:17
We'll do everything that we are used to doing. So let's head over to order delivered, make sure that we implement should broadcast now or should broadcast if you're queuing, and we know that we want to accept the same data into here.
00:30
We need the user because we know, need to know which channel is being sent on. And we need to know the order here as well. And when we look at specifically broadcasting on an orders channel, we're not actually going to need to pass this user in later because we'll
00:45
know the user ID from the order. Okay. Let's broadcast on the users channel. So let's say users dot and let's pass in the user ID.
00:57
Like so. Okay, great. So now over in web, we're going to simulate a few delays to these notifications coming through.
01:07
So I'm going to sleep here for three seconds and then down here, I'm going to sleep for five seconds. And then I'm going to send through the new order delivered notification. Okay.
01:18
So now that we're doing that, how do we listen to multiple channels or how do we listen to multiple events on the same channel? Well, we can just chain onto this. It works in exactly the same way.
01:30
So we can grab everything that we've already done, and we can listen to both of these events on this single channel. So this is now the order delivered event. And let's create out a new delivered variable in here and
01:45
also set the order in here. So let's create our delivered and let's go down to our template and we'll create out another if statement to show if something has been delivered, and then we should get both of these notifications and they should both show.
02:02
Okay. So remember we've added that delay. So let's go over and send this through, let that run in the background. And we should, after a few seconds, see the dispatched.
02:12
And then after five seconds, we'll eventually end up with the order has been delivered. So both of these coming through when they happen and contains all of the data you need to display these types of notifications.

Episode summary

In this episode, we take things a step further by not just listening for a single event with Laravel Echo, but learning how to listen for multiple events on the same channel. We'll walk through creating a new event—OrderDelivered—in addition to any existing events we already had, like OrderDispatched or similar. This helps us track not only when an order is sent out, but also when it's actually delivered to the user.

You'll see how to set up the new event, make sure it broadcasts the correct data (including tying it to the user's channel), and then, over in the frontend, we simulate staggered notifications using some delays so you can see both events land at different times. We'll then set up listeners for both events on the user channel and handle the UI updates for each one—like showing appropriate messages for "dispatched" and "delivered."

By the end of this episode, you'll understand how to manage and display multiple real-time notifications for a single user, making the app's feedback loop much richer and more interactive!

Episode discussion

No comments, yet. Be the first!