Home > Web Development > Laravel Tutorials > How to implement push notifications in Laravel with Firebase.

How to implement push notifications in Laravel with Firebase.

Diego Cortés
Diego Cortés
January 19, 2025
How to implement push notifications in Laravel with Firebase.

Push notifications are a powerful tool for keeping users informed about relevant events and real-time updates. In this article, I will guide you on how to implement push notifications in a Laravel application using Firebase Cloud Messaging (FCM). This process will not only enhance interaction with your users but also allow them to receive important information instantly.

What is Firebase Cloud Messaging?

Firebase Cloud Messaging (FCM) is a free service that allows you to send notifications and messages to users' devices. It integrates efficiently with mobile and web applications, making the implementation of alerts and notifications simple and effective.

Preparations for Implementation

Before starting the implementation of push notifications in Laravel, you need to follow a few preliminary steps:

  1. Create a project in Firebase: Access the Firebase console and create a new project. Once created, navigate to the "Cloud Messaging" section to obtain the necessary credentials.

  2. Configure your Laravel application: Ensure that your Laravel application is ready and running. Install the library that will facilitate integration with Firebase.

    composer require kreait/firebase-php
  3. Configure the .env file: Add your Firebase credentials in the .env file of your Laravel project:

    FIREBASE_CREDENTIALS=/path/to/your/firebase_credentials.json

Implementation in Laravel

Create a Notification Service

To handle notifications from your application, create a new service that will manage sending messages to FCM:

namespace App\Services;

use Kreait\Firebase\Messaging;

class NotificationService
{
    protected $messaging;

    public function __construct(Messaging $messaging)
    {
        $this->messaging = $messaging;
    }

    public function sendNotification($fcmToken, $title, $body)
    {
        $message = CloudMessage::withTarget('token', $fcmToken)
            ->withNotification(Notification::fromArray([
                'title' => $title,
                'body' => $body
            ]));

        return $this->messaging->send($message);
    }
}

Send a Notification

Now that you have the service configured, you can use it in one of your controllers to send notifications:

use App\Services\NotificationService;

public function notifyUser(Request $request)
{
    $token = $request->input('token');
    $title = 'Test Notification';
    $body = 'This is a test notification sent from Laravel.';

    $notificationService = new NotificationService();
    $notificationService->sendNotification($token, $title, $body);

    return response()->json(['message' => 'Notification sent']);
}

Frontend Configuration

To receive notifications in the application, it's essential to properly configure the frontend, whether in a web or mobile application. In the web application, make sure to have the Firebase SDK:

<script src="https://www.gstatic.com/firebasejs/9.1.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.1.2/firebase-messaging.js"></script>

Then, initialize Firebase and request permission to receive notifications:

const messaging = firebase.messaging();
messaging.requestPermission()
    .then(() => {
        console.log('Permission granted');
        return messaging.getToken();
    })
    .then((token) => {
        // Send the token to the server for notifications
    })
    .catch((err) => {
        console.error('Failed to get permission ', err);
    });

Conclusions

Integrating push notifications into your Laravel application using Firebase is an accessible process that will improve communication with your users. Be sure to follow the indicated steps and customize notifications according to your needs.

If you want to expand your knowledge on this topic and others related, I invite you to keep reading more news on my blog.

Diego Cortés
Diego Cortés
Full Stack Developer, SEO Specialist with Expertise in Laravel & Vue.js and 3D Generalist

Categories

Page loaded in 30.26 ms