Komunikasi wektu nyata karo siaran lan reverb Laravel
Komunikasi wektu nyata, ing aplikasi web, nuduhake kemampuan pangguna kanggo ngganti informasi kanthi cepet utawa kanthi wektu tundha minimal.
Sawetara conto komunikasi wektu nyata yaiku: obrolan langsung, kolaborasi wektu nyata, kabar lan nganyari sing kedadeyan tanpa refresh kaca kanthi manual…
Teknologi kayata WebSockets, acara sing dikirim server (SSE), lan polling dawa umume digunakake kanggo ngaktifake komunikasi wektu nyata, ngidini aplikasi web ngirim pengalaman interaktif lan dinamis marang pangguna.
7 menit
Dheweke njaluk sampeyan nggawe obrolan langsung kanggo situs e-dagang, lan sampeyan ora ngerti teknologi apa sing digunakake. Sawetara kolega sampeyan wis ngandhani babagan sawetara teknologi kaya websockets, nanging sampeyan ora ngerti carane ngleksanakake layanan nyebarake.
Sampeyan wis teka ing panggonan sing tepat ing wektu sing tepat: ing ngisor iki, nyatane, aku bakal menehi sampeyan kabeh pandhuan sing dibutuhake kanggo njupuk kauntungan saka siaran laravel, e laravel ngambarke kanggo ngatur komunikasi wektu nyata, banjur ngleksanakake live chat. Aja kuwatir, iki dudu operasi sing rumit, sing penting yaiku duwe ide sing jelas babagan cara ngatur lan nyusun kabeh: sampeyan bakal sinau apa sing kudu diwiwiti sajrone artikel iki.
Dadi, apa sampeyan mikir babagan tumindak saiki? Lungguh kanthi kepenak, ngukir sawetara menit kanggo awake dhewe lan waca kabeh sing dakkandhakake ing siaran laravel e laravel reverb: Aku yakin, ing pungkasan pandhuan, sampeyan bakal bisa nindakake pakaryan sing apik. Sawise ujar manawa, sing bisa daklakoni yaiku muga-muga sampeyan seneng maca lan kerja sing apik!
Laravel Reverb iku alat komunikasi wektu nyata kanggo aplikasi Laravel. Ngidini sambungan WebSockets antarane klien lan server, ngidini nganyari wektu nyata lan interaksi tanpa refresh kaca pancet. Reverb asring digunakake ing aplikasi sing mbutuhake nganyari wektu nyata utawa kemampuan olahpesen cepet, nyedhiyakake cara sing lancar lan efisien kanggo ngatur ijol-ijolan data wektu nyata.
Apa Laravel Reverb
Laravel Reverb minangka konsep sing nggabungake Laravel, kerangka PHP populer sing dikenal kanthi sintaks elegan lan fitur sing kuat, karo Reverb, server WebSocket sing dirancang kanggo komunikasi wektu nyata ing aplikasi web.
Ing konteks iki, Reverb minangka server WebSocket pihak pisanan sing dibangun kanthi eksplisit kanggo aplikasi Laravel. Iku nggampangake komunikasi wektu nyata antarane klien (browser) lan sisih server, mbisakake fitur kayata nganyari langsung, olahpesen cepet, kabar lan fitur kolaborasi tanpa refresh kaca pancet.
Kanthi nggabungake Laravel karo Reverb, pangembang bisa nggawe aplikasi web interaktif lan responsif sing nyedhiyakake pangguna pengalaman sing lancar lan dinamis.
Fitur Utama Laravel Reverb
· Nganyari wektu nyata: Nganyari antarmuka klien kanthi data anyar tanpa ngisi maneh kaca.
· Obrolan Langsung: Ngaktifake olahpesen lan komunikasi wektu nyata antarane pangguna.
· Kabar: Kirimi kabar push menyang pelanggan ing wektu nyata kanggo nganyari pas wektune.
· Suntingan kolaboratif: Nggampangake panyuntingan dokumen utawa proyek bebarengan.
· Skalabilitas: Cepet nangani nomer akeh sambungan simultaneous.
· Kustomisasi: Kemampuan kanggo ngganti fungsi ing wektu nyata kanggo kabutuhan aplikasi tartamtu.
Keuntungan Top Nggunakake Laravel Reverb
Laravel Reverb minangka pangowahan game kanggo pangembang sing pengin nggawe aplikasi web dinamis lan responsif kanthi kemampuan komunikasi wektu nyata. Mangkene sawetara kaluwihan utama sing ditawakake Laravel Reverb:
Kinerja cepet: Ngalami kacepetan sing luar biasa kanthi arsitektur Laravel Reverb sing dioptimalake, sing njamin aliran data sing lancar lan antarmuka pangguna sing responsif sanajan ana beban sing abot.
Integrasi gampang: Kanthi lancar nggabungake Laravel Reverb kanthi kemampuan siaran Laravel, kanthi gampang nggunakake lan nggunakake Laravel Forge kanggo nyederhanakake langganan saluran lan manajemen acara.
Skalabilitas sing disederhanakake: Skala aplikasi sampeyan kanthi gampang kanthi dhukungan Laravel Reverb kanggo skala horisontal, ngatur sambungan lan saluran kanthi efisien ing macem-macem server kanggo nyukupi panjaluk lalu lintas sing akeh.
Kompatibilitas karo protokol Pusher: nggunakake daya saka protokol Laravel Pusher kanggo WebSockets karo Laravel Reverb, nggabungake seamlessly karo Laravel Broadcasting lan Echo kanggo implementasine cepet lan efisien komunikasi nyata-wektu.
Tracking Mastery: Ningkatake dhukungan Pulse ing Laravel Reverb kanggo ngawasi wektu nyata, njamin operasi lancar lan kesehatan sistem kanggo pengalaman pangguna sing lancar.
Instalasi siaran Laravel
Yen sampeyan kudu nambah kapasitas transmisi menyang proyek anyar sampeyan, mula iki kudu ditindakake. Yen sampeyan nggarap proyek sing wis ana, jalanake printah ing ngisor iki:
composer install
php artisan broadcast:install
Printah iki nggawe konfigurasi sing dibutuhake lan file sing dibutuhake:
Yen katon ing folder resources/js, sampeyan bakal nemokake file sing mentas digawe echo.js, sing ngatur sambungan WebSockets.
File konfigurasi Laravel Broadcasting: config/broadcasting.php
file konfigurasi reverb : config/reverb.php
Konfigurasi driver Broadcasting
Kanggo ngatur driver Brodcast sampeyan kudu nyetel paramèter ing file .env di Laravel, kuwi sing driver saka Broadcast dadi on Reverb. Dadi iki contone:
BROADCAST_DRIVER=reverb
REVERB_APP_ID=your_app_id
REVERB_APP_KEY=your_app_key
REVERB_APP_SECRET=your_app_secret
REVERB_HOST="yourhost.test"
REVERB_PORT=8080
REVERB_SCHEME=https
VITE_REVERB_APP_KEY="${REVERB_APP_KEY}"
VITE_REVERB_HOST="${REVERB_HOST}"
VITE_REVERB_PORT="${REVERB_PORT}"
VITE_REVERB_SCHEME="${REVERB_SCHEME}"Netepake Saluran Siaran
Sadurunge nggawe acara, kita kudu nemtokake saluran sing bakal disiarake acara kasebut. Kanggo nindakake iki, kita kudu mbukak file kasebut routes/channels.php lan nambah definisi saluran sing arep kita gunakake. Saluran bisa pribadi lan umum:
- contone saluran pribadi:
Broadcast::channel('App.User.{id}', function ($user, $id) {
return $user->id === $id;
});- contone saka saluran umum:
Yen sampeyan pengin siaran ing saluran umum, mung nemtokake rute umum tanpa mriksa otentikasi:
Broadcast::channel('public-updates', function () {
return true;
});Nggawe kelas Acara
Kanggo ngirim pesen ing wektu nyata, sampeyan kudu nemtokake acara sing bakal disiarake. Kanggo nindakake iki, sampeyan kudu mbukak printah ing ngisor iki artisan:
php artisan make:event UserEventKelas UserEvent kui, ngleksanakake antarmuka ShouldBroadcast lan nambah impor sing dibutuhake kanggo nyiarake acara kasebut. Punika conto implementasine:
contone saka saluran pribadi
namespace App\Events;
use App\Models\User;
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 UserEvent implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
/**
* Create a new event instance.
*/
public function __construct(public $downloadURL, public User $user)
{
//
}
/**
* Get the channels the event should broadcast on.
*
* @return array<int, \Illuminate\Broadcasting\Channel>
*/
public function broadcastOn(): array
{
return [
new PrivateChannel("App.User." . $this->user->id),
];
}
public function broadcastWith(): array
{
return array(
'username' => __('app.welcome_message', ['username' => $this->user->name]),
'message' => __('events.download_hawb_ready'),
);
}
public function broadcastAs(): string
{
return 'user.notification';
}
}Conto saluran umum:
namespace App\Events;
use App\Models\User;
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 UserEvent implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
/**
* Create a new event instance.
*/
public function __construct(public $downloadURL)
{
//
}
/**
* Get the channels the event should broadcast on.
*
* @return array<int, \Illuminate\Broadcasting\Channel>
*/
public function broadcastOn(): array
{
return [
new Channel("public-updates"),
];
}
public function broadcastWith(): array
{
return array(
'message' => __('events.download_hawb_ready'),
);
}
public function broadcastAs(): string
{
return 'public.notification';
}
}Acara aktivasi
Kanggo nyiarake acara, gunakake broadcast()helper ing controller Panjenengan. Mangkene carane sampeyan bisa ngirim UserEvent:
use App\Events\UserEvent;
broadcast(new UserEvent($data));Setel ngrungokake frontend
Saiki, sampeyan kudu ngrungokake acara sing disiarkan ing ngarep. Sampeyan bisa nggunakake Laravel Echo con Reverb WebSocket kanggo nindakaken. Bukak file kasebut resources/js/echo.js lan nambah ing ngisor iki ngrungokake:
window.Echo = new Echo({
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'],
});
document.addEventListener('DOMContentLoaded', function () {
const userID = window.userID;
window.Echo.private(`App.User.${userID}`)
.listen('.user.notification', (response) => {
console.log("Event received:", response);
showNotification(response);
});
});Isi ing Aset
Sawise nyiyapake acara sampeyan ngrungokake, sampeyan kudu ngumpulake sumber daya frontend kanggo mesthekake pangowahan ditrapake. Jalanake printah ing ngisor iki:
npm run devPrintah iki ngidini sampeyan ngumpulake aset, yaiku file JavaScript, kalebu ing Pendengar gema.
Miwiti Queue Listener
Il siaran laravel kerjane asynchronously, supaya sampeyan kudu mbukak ing pendengar antrian kanggo proses antrian acara. Kanggo miwiti ing saiki sampeyan kudu mbukak printah:
php artisan queue:listenPrintah iki miwiti proses acara wektu nyata lan njamin operasi transmisi sing bener.
Priksa konfigurasi saluran
Kanggo mesthekake saluran sampeyan wis disetel kanthi bener, priksa konfigurasi sampeyan routes/channels.php. Uga, jalanake perintah ing ngisor iki kanggo dhaptar kabeh saluran sing didaftar:
php artisan channel:list
Printah iki bakal nampilake kabeh saluran siaran sing dikonfigurasi ing aplikasi sampeyan.
Miwiti reverb laravel
Sabanjure, sampeyan kudu miwiti server Reverb WebSocket. Jalanake printah ing ngisor iki, priksa manawa nyetel parameter kasebut --hostname nulis domain utawa lingkungan lokal sampeyan:
php artisan reverb:start --host="0.0.0.0" --port=8080 --hostname="yourhost.test" --debug
Iki miwiti server Reverb ing port sing ditemtokake.
Konfigurasi rute aplikasi
Priksa manawa rute aplikasi sampeyan wis dikonfigurasi kanthi bener kanggo nyakup saluran siaran. Sampeyan bisa ngatur rute kaya ing ngisor iki:
return Application::configure(basePath: dirname(__DIR__))
->withRouting(
web: __DIR__ . '/../routes/web.php',
commands: __DIR__ . '/../routes/console.php',
channels: __DIR__ . '/../routes/channels.php',
health: '/up',
);Kanthi ngetutake langkah-langkah iki, sampeyan bisa nyiyapake siaran kanthi sukses Reverb in Laravel 11. Yen sampeyan wis nyiyapake kabeh kanthi bener, sampeyan bakal bisa ngirim pesen ing wektu nyata, mesthekake nganyari lancar ing saindhenging aplikasi sampeyan. Aja lali mriksa konfigurasi lan gunakake perintah kasebut php artisan channel:list kanggo mriksa konfigurasi saluran sampeyan.
