Introduction
Laravel Reverb is an official, first-party WebSocket server designed for Laravel applications. It enables real-time, two-way communication between the client and server, making it ideal for building applications like chat systems, live notifications, and interactive dashboards.
Before Laravel Reverb, developers relied on third-party services such as Pusher, Socket.io, and Ably for real-time broadcasting. However, with Reverb, Laravel now provides an in-house solution, allowing developers to host WebSocket broadcasting on their own server, eliminating third-party dependencies. This makes it a cost-effective, secure, and high-performance option for Laravel applications.
By using Laravel Reverb, developers gain full control over real-time broadcasting while improving speed and security. Whether you’re developing a chat app, live notifications, or a collaborative tool, Reverb simplifies the process within the Laravel ecosystem.
In this post, I’ll walk you through the easy steps to install Laravel Reverb in your Laravel app.
Step 1: Installing Laravel Reverb
To begin using Laravel Reverb, install it with the following command:
php artisan install:broadcasting
What Happens Behind the Scenes?
When you run this command, Laravel automatically configures WebSocket broadcasting by setting up essential files and dependencies, such as `echo.js` and `pusher`. Let’s break down some of the key files created during the setup:
routes/channels.php
This file defines your broadcast channels and their authorization logic, ensuring only authenticated users can access private or presence channels.config/broadcasting.php
This configuration file manages different broadcasting drivers. After installation, Laravel automatically sets Reverb as the default broadcaster.config/reverb.php
All Laravel Reverb settings are stored here. Laravel pre-configures this file, so you don’t have to manually modify anything initially.resources/js/echo.js
Laravel Echo is a lightweight JavaScript library that listens for broadcast events and plays a key role in enabling real-time interactions on the frontend.
Step 2: Configuring the .env
File
By default, Laravel Reverb loads settings from the .env
file. Make sure your .env
file includes the following configurations:
BROADCAST_CONNECTION=reverb QUEUE_CONNECTION=sync REVERB_APP_ID= REVERB_APP_KEY= REVERB_APP_SECRET= REVERB_HOST="localhost" REVERB_PORT=8080 REVERB_SCHEME=http VITE_REVERB_APP_ID="${REVERB_APP_ID}" VITE_REVERB_APP_KEY="${REVERB_APP_KEY}" VITE_REVERB_APP_SECRET="${REVERB_APP_SECRET}" VITE_REVERB_HOST="${REVERB_HOST}" VITE_REVERB_SCHEME="${REVERB_SCHEME}" VITE_REVERB_PORT="${REVERB_PORT}"
Key Configuration Notes
- Set
BROADCAST_CONNECTION
to `reverb` to enable Laravel Reverb. - For local development, keep
QUEUE_CONNECTION=sync
. - In production, switch
QUEUE_CONNECTION=database
and ensure Laravel workers are running.
💡 Pro Tip: If REVERB_APP_ID
, REVERB_APP_KEY
, or REVERB_APP_SECRET
are missing, generate them manually using:
echo "REVERB_APP_ID=$(openssl rand -hex 8)" >> .env echo "REVERB_APP_KEY=$(openssl rand -hex 16)" >> .env echo "REVERB_APP_SECRET=$(openssl rand -hex 32)" >> .env
Step 3: Creating an Event in Laravel
Events allow you to trigger actions within your application. For example, when a user registers, an event can be triggered to notify the admin.
Create an event using the following command:
php artisan make:event FirstEvent
This command generates an event file at app/Events/FirstEvent.php
. Open the file and modify it as follows:
<?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 FirstEvent implements ShouldBroadcast { use Dispatchable, InteractsWithSockets, SerializesModels; public $message = ''; /** * Create a new event instance. */ public function __construct() { $this->message = 'First Event'; } /** * Get the channels the event should broadcast on. * * @return array<int, \Illuminate\Broadcasting\Channel> */ public function broadcastOn(): array { return [ new Channel('first-event'), ]; } }
Breaking Down the Code:
- FirstEvent : The event name.
- ShouldBroadcast : Ensures the event is sent via WebSockets.
- broadcastOn() : Specifies the WebSocket channel (`first-event`).
Step 4: Triggering the Event
After defining the event, you need to trigger it. You can dispatch events from routes, controllers, or commands.
Example: Triggering from Routes routes/web.php
<?php use Illuminate\Foundation\Application; use Illuminate\Support\Facades\Route; use Inertia\Inertia; use App\Events\FirstEvent; Route::get('/', function () { FirstEvent::dispatch(); return Inertia::render('Welcome', [ 'canLogin' => Route::has('login'), 'canRegister' => Route::has('register'), 'laravelVersion' => Application::VERSION, 'phpVersion' => PHP_VERSION, ]); }); require __DIR__.'/auth.php';
This code triggers the FirstEvent whenever a user visits the homepage.
Step 5: Listening for Events on the Frontend
To listen for the event on the frontend, subscribe to the WebSocket channel using Laravel Echo.
1. Open resources/js/app.js
.
2. Add the following code at the bottom:
window.Echo.channel("first-event").listen("FirstEvent", (e) => { console.log(e); });
Here’s how it works:
- Laravel Echo subscribes to the “first-event” channel.
- When FirstEvent is broadcast, the browser logs the event data to the console.
Step 6: Running the Laravel Development Server
To start the Laravel web server, run:
php artisan serve
This will open the web server.
Step 7: Running the Laravel Reverb Server
To start the Laravel Reverb WebSocket server, run:
php artisan reverb:start
By default, Reverb runs on 0.0.0.0:8080
, making it accessible from all network interfaces.
Custom Host and Port
To start the Reverb server on a custom host or port, use:
php artisan reverb:start --host=127.0.0.1 --port=9000
Step 8: Compiling Frontend Changes
To ensure that frontend changes are reflected, run:
npm run dev
This ensures that JavaScript files are recompiled whenever modifications are made.
Conclusion
Laravel Reverb provides a cost-effective, scalable, and secure way to integrate real-time WebSockets into your Laravel applications. With this setup, you can build live chat systems, interactive dashboards, and instant notifications with ease.