Getting Started with Laravel Reverb: Real-Time Broadcasting Made Easy

Laravel Reverb is a robust real-time event broadcasting solution for Laravel applications. It integrates seamlessly with Laravel's existing event system, enabling real-time communication via WebSockets. Here's a step-by-step guide to get you started quickly.

You can also check out example on Github laravel-reverb-broadcasting

Step 1: Set Up Laravel Project

First, ensure Laravel is installed. If not, create a new Laravel project:

composercreate-projectlaravel/laravelreverb-demo
cdreverb-demo

Step 2: Install Laravel Reverb

Add Laravel Reverb to your project:

composerrequirelaravel/reverb

Publish Reverb's configuration file:

phpartisanvendor:publish--provider="Laravel\Reverb\ReverbServiceProvider"

Step 3: Configure Environment

Update your .env file to use Reverb:

BROADCAST_DRIVER=reverb
REVERB_APP_ID=your-app-id# random-value
REVERB_APP_KEY=your-app-key# random-value
REVERB_APP_SECRET=your-app-secret# random-value
REVERB_HOST=127.0.0.1
REVERB_PORT=8080
REVERB_SCHEME=http


VITE_REVERB_APP_KEY="${REVERB_APP_KEY}"
VITE_REVERB_HOST="${REVERB_HOST}"
VITE_REVERB_PORT="${REVERB_PORT}"
VITE_REVERB_SCHEME="${REVERB_SCHEME}"

Step 4: Install Broadcaster

Run this command to install reverb broadcaster

phpartisaninstall:broadcasting

then type 'reverb' in command line, and choose 'yes' on next step.

Step 5: Run Laravel Reverb Server

Start the Reverb WebSocket server:

phpartisanreverb:start

Ensure broadcasting.php is set correctly (it should already reference Reverb by default):

Step 6: Create an Event

Generate a new event class:

phpartisanmake:eventMessageSent

Example event setup (MessageSent.php):

<?php

namespace App\Events;

use Illuminate\Broadcasting\Channel;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcastNow;
use Illuminate\Foundation\Events\Dispatchable;

classMessageSentimplementsShouldBroadcastNow
{
useDispatchable,InteractsWithSockets;

/**
     * Create a new event instance.
     */
publicfunction__construct(publicstring$message)
{
//
}

/**
     * Get the channels the event should broadcast on.
     *
     *@returnarray<int, \Illuminate\Broadcasting\Channel>
     */
publicfunctionbroadcastOn():Channel
{
returnnewChannel('chat');
}
}

Step 7: Trigger the Event

Fire your event from anywhere in your Laravel application:

event(new\App\Events\MessageSent('Hello Reverb!'));

Step 8: Client-side Integration

To receive broadcast events, set up your frontend with Laravel Echo:

Install Echo and Pusher (used by Echo to connect to Reverb):

npminstalllaravel-echopusher-js

Configure Echo (resources/js/echo.js):

importEchofrom"laravel-echo";

importPusherfrom"pusher-js";
window.Pusher=Pusher;

window.Echo=newEcho({
broadcaster:"reverb",
key:import.meta.env.VITE_REVERB_APP_KEY,
wsHost:import.meta.env.VITE_REVERB_HOST,
wsPort:import.meta.env.VITE_REVERB_PORT??80,
wssPort:import.meta.env.VITE_REVERB_PORT??443,
forceTLS: (import.meta.env.VITE_REVERB_SCHEME??"https")==="https",
enabledTransports: ["ws","wss"],
});

window.Echo.channel("chat").listen("MessageSent",(e)=>{
console.log(e.message);
});

Run your frontend:

npmrundev

That's It!

You've successfully set up Laravel Reverb and configured basic event broadcasting. Now, your Laravel app can utilize powerful real-time features!

Reference Links

Github Repo: laravel-reverb-broadcasting