伺服器端函式庫

用 Laravel 實作即時 WebSocket

伺服器端用 Laravel Broadcasting，瀏覽器端用 Laravel Echo，程式碼不需修改。

登入後，範例程式碼會自動帶入您的叢集主機。 登入

使用 AI 程式開發代理？ 複製 Agent 提示詞 ↓

  1. 安裝

    composer require pusher/pusher-php-server
npm install --save-dev laravel-echo pusher-js

  2. 設定應用程式憑證

    BROADCAST_CONNECTION=pusher
PUSHER_APP_ID=YOUR_APP_ID
PUSHER_APP_KEY=YOUR_APP_KEY
PUSHER_APP_SECRET=YOUR_APP_SECRET
PUSHER_HOST=ws.hibira.io
PUSHER_PORT=443
PUSHER_SCHEME=https
PUSHER_APP_CLUSTER=ap

VITE_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
VITE_PUSHER_HOST="${PUSHER_HOST}"
VITE_PUSHER_PORT="${PUSHER_PORT}"
VITE_PUSHER_SCHEME="${PUSHER_SCHEME}"

  3. 設定用戶端

    // resources/js/echo.js
import Echo from 'laravel-echo';
import Pusher from 'pusher-js';
window.Pusher = Pusher;

window.Echo = new Echo({
  broadcaster: 'pusher',
  key: import.meta.env.VITE_PUSHER_APP_KEY,
  cluster: 'ap',
  wsHost: import.meta.env.VITE_PUSHER_HOST,
  wsPort: import.meta.env.VITE_PUSHER_PORT,
  wssPort: import.meta.env.VITE_PUSHER_PORT,
  forceTLS: import.meta.env.VITE_PUSHER_SCHEME === 'https',
  enabledTransports: ['ws', 'wss'],
});

window.Echo.private('orders.' + orderId)
  .listen('OrderShipped', (e) => console.log(e.order));

  4. 發佈事件

    // Any event that implements ShouldBroadcast
OrderShipped::dispatch($order);

Agent 提示詞

將這段提示詞貼到 Claude Code、Cursor、GitHub Copilot 或其他 AI 程式開發代理，它會依照上方的設定，把 Hibira 串接到您的 Laravel 專案。

請將 YOUR_APP_KEY 等預留位置換成儀表板中的值，或讓代理保留為環境變數，之後再自行填入。

或連接 Hibira MCP 伺服器，讓代理自行建立應用程式並填入憑證。 連接您的 AI 程式開發代理 →

請使用儀表板中的應用程式金鑰與密鑰。頻道、事件與授權端點的用法和 Pusher 完全相同。 函式庫說明文件 ↗