Зв'язок у реальному часі з трансляцією та реверберацією Laravel
Спілкування в режимі реального часу у веб-додатках означає здатність користувачів обмінюватися інформацією миттєво або з мінімальною затримкою.
Деякі приклади спілкування в реальному часі: живі чати, співпраця в реальному часі, сповіщення та оновлення, які надходять без оновлення сторінки вручну…
Такі технології, як WebSockets, події, що надсилаються сервером (SSE), і довге опитування, зазвичай використовуються для забезпечення зв’язку в реальному часі, дозволяючи веб-додаткам надавати користувачам інтерактивний і динамічний досвід.
- Що таке Laravel Reverb
- Інсталяція трансляції Laravel
- Налаштуйте драйвер трансляції
- Визначте канали трансляції
- Створіть клас Event
- Події активації
- Налаштувати фронтенд прослуховування
- Заповніть Активи
- Запустіть Queue Listener
- Перевірка конфігурації каналу
- Запустіть реверберацію laravel
- Налаштування маршрутизації програми
7 хвилин
Вони попросили вас розробити живий чат для сайту електронної комерції, а ви не знаєте, яку технологію використовувати. Деякі з ваших колег розповідали вам про такі технології, як веб-сайт, але ви не уявляєте, як реалізувати послугу мовлення.
Ви потрапили в потрібне місце в потрібний час: нижче я надам вам усі необхідні інструкції, щоб скористатися перевагами трансляція laravelІ Laravel реверберація для керування спілкуванням у реальному часі, а потім запровадити живий чат. Не хвилюйтеся, це не складні операції, важливо мати чіткі уявлення про те, як все організувати та структурувати: ви дізнаєтеся, що вам потрібно для початку в цій статті.
Отже, що ви думаєте про дії зараз? Сідайте зручно, виділіть кілька хвилин для себе і прочитайте все, що я маю вам розповісти про трансляцію laravel e реверберація laravel: Я впевнений, що наприкінці посібника ви зможете чудово виконувати роботу. Сказавши це, все, що я можу зробити, це побажати вам приємного читання та гарної роботи!
Laravel Reverb це інструмент спілкування в режимі реального часу для програм Laravel. Дозволяє підключення WebSocket між клієнтом і сервером, дозволяючи оновлення та взаємодію в реальному часі без постійного оновлення сторінки. Reverb він часто використовується в програмах, які потребують оновлень у режимі реального часу або можливостей обміну миттєвими повідомленнями, забезпечуючи плавний та ефективний спосіб керування обміном даними в режимі реального часу.
Що таке Laravel Reverb
Laravel Reverb — це концепція, яка поєднує Laravel, популярну структуру PHP, відому своїм елегантним синтаксисом і потужними функціями, з Reverb, сервером WebSocket, призначеним для спілкування в реальному часі у веб-додатках.
У цьому контексті Reverb — це власний сервер WebSocket, створений спеціально для програм Laravel. Це полегшує зв’язок у режимі реального часу між клієнтом (браузером) і стороною сервера, забезпечуючи такі функції, як живі оновлення, обмін миттєвими повідомленнями, сповіщення та функції спільної роботи без постійного оновлення сторінки.
Завдяки інтеграції Laravel з Reverb розробники можуть створювати інтерактивні веб-програми, що швидко реагують, які забезпечують користувачам плавну та динамічну роботу.
Основні характеристики Laravel Reverb
· Оновлення в режимі реального часу: миттєво оновлюйте клієнтські інтерфейси новими даними без перезавантаження сторінки.
· Живий чат: дозволяє обмінюватися повідомленнями та спілкуватися між користувачами в реальному часі.
· Сповіщення: надсилайте клієнтам push-повідомлення в режимі реального часу для отримання своєчасних оновлень.
· Спільне редагування: полегшує одночасне редагування спільних документів або проектів.
· Масштабованість: Ефективно обробляє велику кількість одночасних підключень.
· Налаштування: можливість адаптувати функціональні можливості в режимі реального часу до конкретних потреб програми.
Основні переваги використання Laravel Reverb
Laravel Reverb змінює правила гри для розробників, які хочуть створювати динамічні веб-програми, що швидко реагують, із можливостями спілкування в реальному часі. Ось деякі з основних переваг Laravel Reverb:
Швидка продуктивність: Відчуйте надзвичайну швидкість завдяки оптимізованій архітектурі Laravel Reverb, яка забезпечує плавний потік даних і чутливий інтерфейс користувача навіть за великих навантажень.
Легка інтеграція: Бездоганно інтегрує Laravel Reverb із можливостями трансляції Laravel, легко розгортаючи та використовуючи Laravel Forge для спрощення підписки на канали та керування подіями.
Спрощена масштабованість: Легко масштабуйте свою програму за допомогою вбудованої підтримки Laravel Reverb для горизонтального масштабування, ефективного керування з’єднаннями та каналами на кількох серверах для задоволення зростаючих потреб у трафіку.
Сумісність з протоколом Pusher: використовує потужність протоколу Laravel Pusher для WebSockets з Laravel Reverb, бездоганно інтегруючись із Laravel Broadcasting і Echo для швидкого й ефективного здійснення зв’язку в реальному часі.
Майстерність стеження: Використовує вбудовану підтримку Pulse в Laravel Reverb для моніторингу в реальному часі, забезпечуючи безперебійну роботу та працездатність системи для бездоганної взаємодії з користувачем.
Інсталяція трансляції Laravel
Якщо вам потрібно додати пропускну здатність до вашого нового проекту, то це має бути зроблено саме так. Якщо ви працюєте над існуючим проектом, виконайте такі команди:
composer install
php artisan broadcast:install
Ця команда створює необхідні конфігурації та потрібні файли:
Якщо заглянути в папку resources/js, ви побачите щойно створений файл echo.js, який керує підключеннями WebSocket.
Конфігураційні файли Трансляція Laravel: config/broadcasting.php
файл конфігурації реверберації : config/reverb.php
Налаштуйте драйвер трансляції
Щоб налаштувати драйвер Трансляція вам потрібно встановити параметри у файлі .env di Laravel, такий, що водій віщати бути на Reverb. Отже, ось приклад:
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}"Визначте канали трансляції
Перш ніж створювати події, нам потрібно визначити канали, на яких транслюватимуться події. Для цього нам потрібно відкрити файл routes/channels.php і додайте визначення каналів, які ми хочемо використовувати. Канали можуть бути приватними та публічними:
- приклад приватного каналу:
Broadcast::channel('App.User.{id}', function ($user, $id) {
return $user->id === $id;
});- приклад громадського каналу:
Якщо ви хочете транслювати на загальнодоступному каналі, просто визначте загальнодоступний маршрут без будь-яких перевірок автентифікації:
Broadcast::channel('public-updates', function () {
return true;
});Створіть клас Event
Щоб надсилати повідомлення в режимі реального часу, необхідно визначити подію, яка буде транслюватися. Для цього потрібно виконати таку команду artisan:
php artisan make:event UserEventКлас UserEvent створений, реалізує інтерфейс ShouldBroadcast і додайте імпорт, необхідний для трансляції події. Ось приклад реалізації:
приклад приватного каналу
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';
}
}Приклад публічного каналу:
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';
}
}Події активації
Щоб транслювати подію, використовуйте broadcast()помічник у вашому контролері. Ось як ви можете подати UserEvent:
use App\Events\UserEvent;
broadcast(new UserEvent($data));Налаштувати фронтенд прослуховування
Тепер вам потрібно слухати трансляцію подій на інтерфейсі. Ви можете використовувати Laravel Echo з Reverb WebSocket зробити це. Відкрийте файл resources/js/echo.js і додати наступне слухач:
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);
});
});Заповніть Активи
Після налаштування події слухач, вам потрібно скомпілювати ресурси зовнішнього інтерфейсу, щоб гарантувати застосування змін. Виконайте таку команду:
npm run devЦя команда дозволяє компілювати ресурси, тобто файли JavaScript, включаючи Ехо слухачів.
Запустіть Queue Listener
Il трансляція laravel він працює асинхронно, тому вам потрібно запустити слухач черги для обробки подій у черзі. Щоб почати чергу потрібно виконати команду:
php artisan queue:listenЦя команда запускає обробку подій у реальному часі та забезпечує правильну роботу передачі.
Перевірка конфігурації каналу
Щоб переконатися, що ваші канали налаштовані правильно, перевірте свою конфігурацію routes/channels.php. Також виконайте таку команду, щоб отримати список усіх зареєстрованих каналів:
php artisan channel:list
Ця команда відобразить усі канали трансляції, налаштовані у вашій програмі.
Запустіть реверберацію laravel
Далі потрібно запустити сервер Reverb WebSocket. Виконайте наступну команду, переконавшись, що встановлено параметр --hostname написання вашого домену або локального середовища:
php artisan reverb:start --host="0.0.0.0" --port=8080 --hostname="yourhost.test" --debug
Це запускає сервер Reverb на вказаному порту.
Налаштування маршрутизації програми
Переконайтеся, що маршрутизацію вашої програми налаштовано правильно, щоб включити канали широкомовлення. Ви можете налаштувати маршрути наступним чином:
return Application::configure(basePath: dirname(__DIR__))
->withRouting(
web: __DIR__ . '/../routes/web.php',
commands: __DIR__ . '/../routes/console.php',
channels: __DIR__ . '/../routes/channels.php',
health: '/up',
);Виконуючи ці дії, ви зможете успішно налаштувати трансляцію за допомогою Reverb in Laravel 11. Після того, як ви все правильно налаштуєте, ви зможете транслювати повідомлення в режимі реального часу, забезпечуючи безперебійне оновлення всієї програми. Не забудьте перевірити свою конфігурацію та використати команду php artisan channel:list щоб перевірити конфігурацію каналу.
