Laravel 廣播伺服器配置

說明

本篇文章主要分享廣播伺服器配置。

廣播驅動程式

這裡使用 Laravel Reverb

Reverb Env

REVERB_APP_ID=my-app-id
REVERB_APP_KEY=my-app-key
REVERB_APP_SECRET=my-app-secret
# 此專案主機
REVERB_HOST="enjoy.com"
# 此專案主機 Port
REVERB_PORT=80
# 此專案超文字傳輸通訊協定
REVERB_SCHEME=http
# 廣播驅動程式 Port
# 例如: 0:0:0:0:8080。REVERB_PORT 就是8080，8080簡寫80
REVERB_SERVER_PORT=80

根據自己的伺服器調整 REVERB_HOST, REVERB_PORT, REVERB_SCHEME。

Laravel Echo

import Echo from 'laravel-echo';

import Pusher from 'pusher-js';
window.Pusher = Pusher;

window.Echo = new Echo({
    broadcaster: 'reverb',
    // Reverb key
    key: import.meta.env.VITE_REVERB_APP_KEY,
    /**
     * 此主機為指向廣播驅動程式，而非後端專案的主機
     * 例如: ws.enjoy.com 反向代理指向 0.0.0.0:8080
     */
    wsHost: 'ws.enjoy.com',
    // 反向代理的 http port，例如: ws.enjoy.com 反向代理使用 80 port，wsPort 就是 80
    wsPort: 80,
    // 反向代理的 https port
    wssPort: 443,
    forceTLS: (import.meta.env.VITE_REVERB_SCHEME ?? 'https') === 'https',
    enabledTransports: ['ws', 'wss'],
    auth: {
        headers: {
            // jwt 身分驗證，一般身分驗證可以不用另外寫
            Authorization: `Bearer jwt token`,
        }
    },
    // 後端專案的廣播驗證路由，前後端分離的話記得設定
    authEndpoint: 'http://enjoy.com/broadcasting/auth'
});

這裡設定官方文件都是用 import.meta.env.* 變數的方式，為了讓讀者了解要設定什麼內容，有些我直接使用純文字的方式。

有關廣播驅動程式反向代理請參考底下的相關文章

Apache Laravel 反向代理

<VirtualHost *:80>
    ServerName enjoy.com
    ServerAdmin webmaster@localhost
    DocumentRoot path/to/laravel/public/

    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined

    <IfModule mod_proxy.c>
        RewriteEngine On
        RewriteCond %{REQUEST_URI} ^/app
        RewriteRule ^(.*)$ http://0.0.0.0:8080/$1 [P]

        <Proxy http://0.0.0.0:8080>
            ProxyPreserveHost On
            ProxyPassReverse /
            ProxyPassReverseCookiePath / /app
        </Proxy>
    </IfModule>
</VirtualHost>

基本上是在 Apache Laravel 的 VirtualHost 裡面加上一段代理，主要為 <IfModule mod_proxy.c> 區塊，先檢查是否有開啟 proxy module，有的話再進行廣播的反向代理。

• RewriteEngine: 開啟重寫引擎，允許你根據規則改變請求的 URL
• RewriteCond: 重寫條件，只有當請求的 URI 以 /app 開頭時，下面的重寫規則才會生效。
• RewriteRule: 重寫規則
• ^(.*)$ 匹配整個 URI。
• $1 代表匹配的 URI。
• [P] 標誌表示使用代理（proxy）功能
• ProxyPreserveHost: 使用傳入的 Host HTTP 請求標頭進行代理請求，也就是假設原本標頭 Host 是 abc.com 它將不會被更改。
• ProxyPassReverse: 調整從反向代理伺服器傳送的 HTTP 回應標頭中的 URL，也就是回應標頭的 URL 會從 0.0.0.0:8000 改成 enjoy.com
• ProxyPassReverseCookiePath: 此指令重寫 Set-Cookie 標頭中的路徑字串，從 / 重寫為 /app。

同源政策

若需跨域進行廣播驗證，記得將 broadcasting/auth 添加進 cors.php 的 paths。

cors.php

<?php

return [
    'paths' => ['broadcasting/auth'],
];

參考

• Laravel 廣播
• Laravel Reverb
• Github Laravel Reverb in Production Server
• Github Laravel Reverb in Production