與 Laravel 廣播和混響進行即時通信

在 Web 應用程式中，即時通訊是指使用者立即或以最小延遲交換資訊的能力。

即時通訊的一些範例包括：即時聊天、即時協作、無需手動刷新頁面即可發生的通知和更新…

WebSocket、伺服器發送事件 (SSE) 和長輪詢等技術通常用於實現即時通信，從而允許 Web 應用程式向使用者提供互動式動態體驗。

7 minuti

他們要求您為電子商務網站開發即時聊天功能，但您不知道該使用什麼技術。您的一些同事已經告訴您一些技術，例如 的WebSocket，但你不知道如何實現服務 廣播.

您在正確的時間來到了正確的地點：事實上，下面我將為您提供所有必要的說明，以利用以下優勢： Laravel 廣播，而 laravel 混響 用於管理即時通信，然後實現即時聊天。別擔心，這些並不是複雜的操作，重要的是對如何組織和建立一切有清晰的想法：您將在本文的過程中了解入門所需的內容。

那麼，您認為現在就採取行動呢？舒服地坐著，為自己騰出幾分鐘的時間，閱讀我要告訴你的一切 在 Laravel 廣播上 e Laravel 殘響：我確信，讀完本指南後，您將完全有能力出色地完成工作。話雖如此，我所能做的就是祝您閱讀愉快，工作順利！

Laravel 殘響 它是應用程式的即時通訊工具 Laravel。允許連接 WebSocket的 客戶端和伺服器之間，允許即時更新和交互，而無需不斷刷新頁面。 混響 它通常用於需要即時更新或即時訊息功能的應用程式中，提供平滑有效的方式來管理即時資料交換。

什麼是 Laravel 混響

Laravel Reverb 是一個概念，結合了 Laravel（一種流行的 PHP 框架，以其優雅的語法和強大的功能而聞名）和 Reverb（專為 Web 應用程式中的即時通訊而設計的 WebSocket 伺服器）。

在這種情況下，Reverb 是專門為 Laravel 應用程式建置的第一方 WebSocket 伺服器。它促進客戶端（瀏覽器）和伺服器端之間的即時通信，實現即時更新、即時訊息、通知和協作功能等功能，而無需不斷刷新頁面。

透過將 Laravel 與 Reverb 集成，開發人員可以創建互動式和響應式 Web 應用程序，為使用者提供流暢、動態的體驗。

Laravel Reverb 的主要特點

· 即時更新：以新資料即時更新客戶端介面，無需重新載入頁面。

· 即時聊天：支援用戶之間的即時訊息傳遞和通訊。

· 通知：即時向客戶發送推播通知，以便及時更新。

· 協作編輯：促進共享文件或專案的同步編輯。

· 可擴充性：有效處理大量並發連線。

· 客製化：能夠即時調整功能以適應特定的應用程式需求。

使用 Laravel Reverb 的主要好處

Laravel Reverb 是一款遊戲規則改變者，適用於希望創建具有即時通訊功能的動態、響應式 Web 應用程式的開發人員。以下是 Laravel Reverb 提供的一些主要優點：

快速性能： 透過 Laravel Reverb 的最佳化架構體驗卓越的速度，即使在重負載下也能確保流暢的資料流和回應靈敏的使用者介面。

輕鬆整合： 將 Laravel Reverb 與 Laravel 的廣播功能無縫集成，輕鬆部署和利用 Laravel Forge 來簡化頻道訂閱和活動管理。

簡化的可擴展性： 利用 Laravel Reverb 內建的水平擴展支援輕鬆擴展您的應用程序，有效管理跨多個伺服器的連接和通道，以滿足不斷增長的流量需求。

與 Pusher 協定的兼容性： 利用 Laravel Pusher 協議的強大功能，將 WebSockets 與 Laravel Reverb 結合起來，與 Laravel Broadcasting 和 Echo 無縫集成，以快速高效地實現即時通訊。

追蹤掌握： 利用 Laravel Reverb 中 Pulse 的內建支援進行即時監控，確保平穩運行和系統運行狀況，從而實現無縫的用戶體驗。

Laravel 廣播安裝

如果您需要為新項目增加傳輸容量，那麼應該這樣做。如果您正在處理現有項目，請執行以下命令：

composer install
php artisan broadcast:install

此命令建立必要的配置和所需的檔案：

如果你查看資料夾 resources/js，你會發現一個新生成的文件 迴聲.js，管理連接 WebSocket的.

設定檔 Laravel 廣播： config/broadcasting.php

混響設定檔 : config/reverb.php

配置廣播驅動程式

配置驅動程式 廣播 你必須在文件中設定參數 .env di Laravel，這樣的驅動程式 播放 在 混響。這是一個例子：

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;
});

建立事件類

若要即時傳送訊息，您需要定義將廣播的事件。為此，您需要執行以下命令 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 迴聲 同 混響 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的，包括 迴聲聽眾.

啟動佇列監聽器

Il Laravel 廣播 它是異步工作的，所以你需要運行 佇列監聽器 處理排隊的事件。要開始 隊列 你需要運行命令：

php artisan queue:listen

此命令啟動即時事件處理並確保正確的傳輸操作。

檢查通道配置

為了確保您的頻道設定正確，請檢查您的配置 routes/channels.php。另外，執行以下命令列出所有已註冊的頻道：

php artisan channel:list

此命令將顯示應用程式中配置的所有廣播頻道。

啟動混響 laravel

接下來需要啟動伺服器 混響 WebSocket。執行以下命令，確保設定參數 --hostname 編寫您的網域或本機環境：

php artisan reverb:start --host="0.0.0.0" --port=8080 --hostname="yourhost.test" --debug

這將在指定連接埠上啟動混響伺服器。

設定應用程式路由

確保您的應用程式路由配置正確以包含廣播頻道。您可以如下設定路由：

return Application::configure(basePath: dirname(__DIR__))
    ->withRouting(
        web: __DIR__ . '/../routes/web.php',
        commands: __DIR__ . '/../routes/console.php',
        channels: __DIR__ . '/../routes/channels.php',
        health: '/up',
    );

按照以下步驟，您可以成功設定廣播 混響 in Laravel 11. 一旦一切設定正確，您將能夠即時廣播訊息，確保整個應用程式的無縫更新。不要忘記檢查您的配置並使用命令 php artisan channel:list 檢查您的頻道配置。