Let us learn how to Build Real Time Web Notification in Laravel using Pusher with the support of our Laravel support services at Bobcares.

Setup Real-Time Web Notification in Laravel using Pusher

First and foremost, we must register an account in Pusher and obtain API credentials from there.

Now we need to install Pusher SDK, which we can do using the composer using the line below.

composer require pusher/pusher-php-server

After the composer is finished, we must configure Laravel to utilize Pusher as its broadcast driver by updating the variables shown below in the.env file.



We now require an event to be transmitted to the pusher driver. Let’s start by making a NotificationEvent.

php artisan make:event NotificationEvent

This command will generate the file shown below.

namespace App\Events;
use Illuminate\Queue\SerializesModels;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
class NotificationEvent implements ShouldBroadcast

{
use Dispatchable, InteractsWithSockets, SerializesModels;
public $username;
public $message;
public function __construct($username)
{
$this->username = $username;
$this->message  = "{$username} send you a notification";
}
public function broadcastOn()
{
//it is a broadcasting channel you need to add this route in channels.php file
return ['notification-send'];
}
}
Add broadcasting route in channels.php file
Broadcast::channel('notification-send', function ($user) {
return true;
});

Now we have to move to the next step to set up the Real Time Web Notification in Laravel.

Cache Event at Javascript Side

Use the following command lines to start the Pusher JS library:

var pusher = new Pusher('YOUR_API_KEY', {
encrypted: true
});
After that Subscribe to the Laravel Event channel;

var channel = pusher.subscribe('notification-send');
channel.bind('App\\Events\\NotificationEvent', function(data) {
// this is called when the event notification is received...
});

Testing and Setup

This is the final step to set up a Real Time Web Notification in Laravel.

To test We may send a notice using the following method:

Route::get('test', function () {
event(new App\Events\NotificationEvent('Monika'));
return "Event has been sent!";
});

This is how we Build Real Time Web Notifications in Laravel using Pusher.

[Need assistance with similar queries? We are here to help]

Conclusion

To sum up we have now seen how to Build Real Time Web Notification in Laravel using Pusher with the support tech support team.