Install Pusher and Laravel broadcast components and configure BROADCAST_DRIVER=pusher and QUEUE_CONNECTION; 2. Create an application on the Pusher official website and obtain App Keys, fill in the .env file corresponding to the PUSHER variable; 3. Enable BroadcastServiceProvider in config/app.php and define authorized channels in routes/channels.php; 4. Create an event class that implements the ShouldBroadcast interface, set the broadcast channel and data format, and trigger events in the controller; 5. The front-end introduces Pusher JS and Laravel Echo, initialize the configuration and listen to the corresponding channels; 6. Start the service, log in to the user triggers the event, and verify that the real-time broadcast function is successfully run through the browser console and the Pusher debug panel.

Setting up Pusher with Laravel is straightforward once you know the steps. Pusher allows real-time broadcasting of events in your Laravel app—perfect for notifications, chat apps, or live updates. Here's how to get it working.

? 1. Install Pusher and Laravel Broadcast

First, make sure you have the required packages:

 composer requires pusher/pusher-php-server

Laravel comes with broadcasting support, but you need to enable it. In your .env file, set:

 BROADCAST_DRIVER=pusher

Also make sure QUEUE_CONNECTION is set (usually to sync or database )—broadcasting often works alongside queues.

? 2. Configure Pusher Credentials

Go to Pusher.com , create an account (if you don't have one), and create a new app. Note down these values from the "App Keys" section:

• PUSHER_APP_ID
• PUSHER_APP_KEY
• PUSHER_APP_SECRET
• PUSHER_APP_CLUSTER

Add them to your .env file:

 PUSHER_APP_ID=your_app_id
PUSHER_APP_KEY=your_app_key
PUSHER_APP_SECRET=your_app_secret
PUSHER_APP_CLUSTER=your_cluster

Laravel uses these automatically via the config/broadcasting.php file.

? Tip: Make sure PUSHER_APP_KEY matches what you use in your frontend (eg, in JavaScript).

? 3. Enable Broadcast Service Provider

In config/app.php , uncomment this line in the providers array:

 App\Providers\BroadcastServiceProvider::class,

This registers the routes and logic for broadcasting.

Then, in routes/channels.php , you can define broadcast authorization routes (eg, for private channels).

Example:

 Broadcast::channel('user.{id}', function ($user, $id) {
    return (int) $user->id === (int) $id;
});

? 4. Create and Broadcast an Event

Generate an event:

 php artisan make:event NotificationSent

Open the event file ( app/Events/NotificationSent.php ) and implement ShouldBroadcast :

 <?php

namespace App\Events;

use Illuminate\Broadcasting\Channel;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Queue\SerializesModels;

class NotificationSent implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    public $message;

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

    public function broadcastOn()
    {
        return new PrivateChannel(&#39;user.&#39; . auth()->id());
        // or PublicChannel(&#39;notifications&#39;)
    }

    public function broadcastWith()
    {
        return [&#39;message&#39; => $this->message];
    }
}

Now dispatch the event from a controller:

 event(new NotificationSent('Hello, user!'));

? 5. Listen on the Frontend with JavaScript

Include Pusher JS and Laravel Echo in your frontend (eg, in resources/js/bootstrap.js or Blade):

 <script src="https://js.pusher.com/8.2.0/pusher.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/laravel-echo@1.11.3/dist/echo.iife.js"></script>

Initialize Laravel Echo:

 <script>
    window.Echo = new Echo({
        broadcaster: &#39;pusher&#39;,
        key: &#39;your-pusher-key&#39;, // from PUSHER_APP_KEY
        cluster: &#39;your-cluster&#39;, // eg, &#39;mt1&#39;
        encrypted: true,
        authEndpoint: &#39;/broadcasting/auth&#39;, // for private channels
        auth: {
            headers: {
                &#39;X-CSRF-TOKEN&#39;: document.querySelector(&#39;meta[name="csrf-token"]&#39;).getAttribute(&#39;content&#39;)
            }
        }
    });

    // Listen to private channel
    Echo.private(&#39;user.&#39; userId)
        .listen(&#39;NotificationSent&#39;, (e) => {
            console.log(e.message);
        });
</script>

Make sure you have the CSRF meta tag in your layout:

 <meta name="csrf-token" content="{{ csrf_token() }}">

? 6. Serve and Test

Run your Laravel app:

 php artisan serve

Make sure you're logged in (since private channels depend on auth), then trigger the event.

Check the browser console and Laravel logs ( storage/logs/laravel.log ) for errors.

Use Pusher Debug Console (in Pusher dashboard) to see real-time events being sent.

That's it. You've set up real-time broadcasting with Pusher and Laravel. It's not complicated, but the key parts—correct .env , event setup, auth, and frontend Echo config—must match exactly.

The above is the detailed content of How to set up Pusher with Laravel?. For more information, please follow other related articles on the PHP Chinese website!