Laravel 5.7 中廣播實踐，使用websocket（Redis + socket.io） 技術接收

用Laravel有一年多了，但是廣播這塊一直沒涉及到，最近看着官方文檔結合實用場景，使用最新版本的Laravel5.7做了一個小例子，具體流程如下：

• 使用Laravel的廣播機制觸發廣播事件，使用Redis驅動
• 使用Laravel的隊列讀取事件，Redis驅動釋出出去
• laravel-echo-server通過Redis收聽到該事件
• laravel-echo-server通過socket.io将事件對象發送給laravel-echo
• laravel-echo解析接收到的事件對象

建立項目

使用官方的內建環境Homestead，建立項目過程略過，直接從使用廣播相關的部分開始。

• 打開 config/app.php 找到 'provides' 屬性，将 BroadcastServiceProvider 前的注釋去掉。
• 編輯 .env 檔案，修改BROADCAST_DRIVER=redis
• 建立廣播事件，自動在app/Events和app/Listeners生成檔案。

# php artisan make:event TriggerAlarm           

• 建立該事件的觸發路由，routes/channels.php添加内容。
• 項目增加 predis依賴

# composer require predis/predis           

相關檔案内容如下：

釋出廣播

• 通過postman調用路由

  

• 通過 redis-cli 檢視目前redis中的資料

  

• 讓隊列消費事件

  

• 再檢視redis資料，發現已被消費掉。

  

訂閱廣播

• 使用 Redis + socket.io方式轉發接收，需要安裝開源項目 laravel-echo-server

// 安裝
# npm install -g laravel-echo-server
// 初始化，預設即可，在項目根目錄下生成 laravel-echo-server.json 配置檔案，修改devMode 修改為 true。
# laravel-echo-server init
// 啟動
# laravel-echo-server start           

截圖如下：

• 前端通過laravel-echo 接收廣播

$ npm i --save socket.io-client
$ npm i --save laravel-echo           

• 打開 /resources/assets/js/bootstrap.js 在這個檔案的結尾已經預先寫上了 laravel-echo 的使用例子，進行修改。

  

• 建立頁面,在 resources/views/ 下建立頁面 triggerAlalm.blade.php 内容如下截圖，并增加對應的路由。

  

• 關閉laravel-echo-server，然後建構前端檔案

# npm install
# npm run dev           

• 重新開機laravel-echo-server，在浏覽器裡通路新頁面路由。

  

• 通過postman觸發報警，然後頁面收到資訊，打開警鈴，頁面樣式變更。