Laravel Push Notifications

Laravel Push Notifications

In this article we look at how to send out push notifications to your website users or visitors with Laravel and PushRadar. We will take you through two methods which you can use to send out notifications; direct broadcasting from your server, and an event-based approach using Laravel events. Both methods are easy to set up.

Prerequisites

In order to follow along this guide, you will need the following:

  • PHP 7 or later
  • Composer - see getcomposer.org
  • A PushRadar account - you can create a free account here

Getting started

First of all, create a new Laravel project and change directory to it using your console. If you are integrating push notifications into an existing project, change directory to your project's folder.

We need to include PushRadar's PHP library to broadcast data. Run the following command to get the latest version of PushRadar's PHP server library:

composer require pushradar/pushradar-php

Direct broadcasting approach

PushRadar is very easy to set up. There are two sides to the service. First, you publish a notification on a channel. This channel is then subscribed to by one or more clients, which are the visitors or users of your website or web app. To publish a notification, just call the broadcast method on the PushRadar object, passing in the channel name and the data you wish to broadcast as an array. Here's an example:

  • PHP
$radar = new PushRadar("your-secret-key");
$radar->broadcast("test-channel", array("message" => "Hello World!"));

Note that channel names cannot contain spaces. In the example above, data is broadcast on the channel named test-channel. Remember to replace your-secret-key with your actual PushRadar secret, which you can find on the API page of your dashboard.

Using JavaScript, you can then subscribe to test-channel and receive notifications pushed to that channel in realtime. Following this, you could take actions based upon the notification data such as update your user interface to show a realtime alert, update a graph or open a lightbox window with the content of the notification.

The following JavaScript code shows how to subscribe to test-channel and receive push notifications:

  • HTML
<script src="//www.pushradar.com/pushradar.js"></script>
<script>
    var radar = new PushRadar("your-api-key");
    radar.subscribe.to("test-channel", function (notification) {
        alert(notification.message); // "Hello World!"
    });
</script>

Replace your-api-key with your actual PushRadar API key.

Event-based approach

You can also use an event-based approach to set up push notifications with Laravel. We're going to code it so that each time our event is dispatched, a notification will be broadcast. This saves you from writing broadcasting code each time, you just have to write it once in the event handler. Create a Laravel event using the make:event artisan command as follows:

php artisan make:event MyEvent

Replace the MyEvent.php file contents with the following code:

  • PHP
<?php

namespace App\Events;

use Illuminate\Queue\SerializesModels;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Broadcasting\InteractsWithSockets;

class MyEvent
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    /**
     * The message to broadcast.
     */
    public $message = "";

    /**
     * Creates a new event instance.
     */
    public function __construct($message)
    {
        $this->message = $message;
    }
}

Next, generate an event listener using the following command:

php artisan make:listener MyEventListener

Replace the MyEventListener.php file contents with the following code. As you can see, we will dynamically broadcast the message that is passed through to the MyEvent constructor when the event is triggered. Replace your-secret-key with your actual PushRadar secret.

  • PHP
<?php

namespace App\Listeners;

use App\Events\MyEvent;
use PushRadar\PushRadar;

class MyEventListener
{
    /**
     * Handle the event.
     */
    public function handle(MyEvent $event)
    {
        $radar = new PushRadar("your-secret-key");
        $radar->broadcast("test-channel", array("message" => $event->message));
    }
}

Lastly, register the event and its listener by adding the following event listener mapping in your EventServiceProvider.php file:

\App\Events\MyEvent::class => [
    \App\Listeners\MyEventListener::class
]

Then just trigger the event, passing in a custom message to broadcast:

  • PHP
event(new \App\Events\MyEvent("Hello World!"));

Using JavaScript, you can then subscribe to test-channel and receive event notifications pushed to that channel in realtime. Following this, you could take actions based upon the notification data such as update your user interface to show a realtime alert, update a graph or open a lightbox window with the content of the notification.

The following JavaScript code shows how to subscribe to test-channel and receive push notifications:

  • HTML
<script src="//www.pushradar.com/pushradar.js"></script>
<script>
    var radar = new PushRadar("your-api-key");
    radar.subscribe.to("test-channel", function (notification) {
        alert(notification.message); // "Hello World!"
    });
</script>

Replace your-api-key with your actual PushRadar API key.