[[331445]]

 用這些簡化了 WebSockets 的開源支持工具來控制你的流媒體。

OBS 是現在視頻直播的主流之一。它是直播流媒體到 Twitch 的首選軟件，Twitch 是近來最受歡迎的視頻直播網站之一。有一些非常好的附加組件，可以讓流媒體人從他們的手機或另一個屏幕上進行控制，而不影響正在運行的視頻。事實證明，使用 Node-RED 和 obs-websockets 插件來構建自己的控制面板真的很容易。

我的 OBS 控制儀表盤

我知道你們很多人在想什么 —— “他在同一句話中提到了 WebSockets 和簡單？”很多人在設置和使用 WebSockets 時遇到了困難，WebSockets 允許通過 Web 服務器的單一連接進行雙向通信。Node-RED 內置了對 WebSockets 的支持，是讓這一切變得簡單的原因之一，至少與編寫自己的客戶端/服務器相比是如此。

在開始之前，請確保你已經安裝和配置了 OBS。首先下載并安裝最新穩定版的 obs-websockets插件。對于本文來說，默認的設置就可以了，但我強烈建議你之后按照說明來保護 obs-websockets 的安全。

接下來，下載并安裝 Node-RED，可以在同一個系統上，也可以在不同的系統上（比如樹莓派）。同樣，默認的安裝對我們這篇文章來說是夠了，但最好按照他們網站上的指示進行安全安裝。

現在是有趣的部分。啟動 Node-RED，打開網頁界面（默認在 http://localhost:1880），你有了一個空白的畫布。打開右邊的“漢堡”菜單，選擇“管理口味Manage Palate”。然后點擊“安裝”標簽，搜索 node-red-contrib-dashboard 和 node-red-contrib-rbe 模塊。

安裝好這些模塊后，點擊右側列表，將以下模塊拖拽到畫布上。

• 1 Websocket Out
• 1 Websocket In
• 1 Debug
• 1 Inject
• 1 Switch
• 1 Change
• 2 JSON
• 1 Catch

以下列順序連接它們：

Inject->Button->Change->JSON->Websocket Out
 
Websocket In->JSON->Switch->RBE->Debug
 
Catch->Debug

基本流程

當 “Button” 被按下時（或 “Inject” 節點發送一個時間戳），有效載荷通過 “change” 節點發送，從 JSON 對象轉換為字符串，然后發送到 “WebSocket Out” 節點。當 “WebSocket In” 節點收到消息后，會將其轉換為 JSON 對象，如果不是重復的，則發送到 “Debug” 節點進行輸出。而 “Catch” 節點會捕捉到任何錯誤，并將其放入 “Debug” 面板中。

那有效載荷里有什么呢？讓我們設置好一切，一探究竟。

首先，雙擊 “Button” 打開設置對話框。先使用下拉菜單將有效載荷改為 “JSON”。在該字段中，添加以下內容：

{"request-type":"GetVersion"}

啟用 “If msg arrives on input, emulate a button click” 復選框，然后點擊 “Done” 關閉 “Button” 配置。當消息從 “Inject” 節點傳來時，或者 UI 中的 “Button” 被按下，它將把 JSON 有效載荷發送到下一個節點。

設置 “Button”

現在打開 “Change” 節點。我們要將 msg.payload.message-id 設置為 msg._msgid，方法是將第一個字段從 payload改為 payload.message-id，然后使用第二個字段的下拉菜單將類型從 String 改為 msg.，然后我們將 _msgid 放入該字段。這樣就會把唯一的消息 ID 復制到 JSON 對象的有效載荷中，這樣每個請求就有一個唯一的 ID 進行跟蹤。

然后將其發送到 “JSON” 節點，以便將 JSON 對象轉換為字符串，然后傳遞給 “Websocket Out” 節點。打開 “Websocket Out” 節點，配置到 OBS 的連接。首先，將 Type 更改為 Connect to，然后單擊鉛筆圖標以創建新的連接 URL。將其設置為 ws://OBSMachine:4444/，然后關閉對話框進行保存。OBSMachine 是 OBS 和 obs-websocket 運行的機器名稱。例如，如果 Node-RED 運行在同一臺機器上，則為 ws://localhost:4444，如果是在名為 luxuria.local 的機器上，則為 ws://luxuria.local:4444。關閉并更新 “Websocket Out” 節點。這將向 OBS 中的 WebSocket 發送有效載荷文本字符串。

“Websocket Out” 節點配置

進入 “WebSocket In” 流程！打開 “WebSocket In” 節點，并對其設置 Type 為 Connect to 和我們之前定義的連接的 URL（應自動填充）。接下來是第二個 “JSON” 節點，我們可以不用管它。它接受 OBS 的輸出，并將其轉換為有效載荷對象。

接下來，我們將從中過濾出常規的心跳和狀態更新。打開 “Switch”，將 Property 值設置為 payload["update-type"]?，F在從它下面的下拉菜單中選擇 Is Not Null。點擊 + 添加第二個選項，并從下拉菜單中選擇 otherwise。

“Switch” 節點配置

將 “Switch” 上的新輸出直接連接到 “Debug” 節點的輸入。

RBE 節點將過濾掉重復的內容，需要告訴它要觀察什么字段。由于它應該連接到 “Switch” 的輸出，而它只發送狀態更新，所以這一點很重要，因為 obs-websocket 每隔幾秒鐘就會發送更新。默認情況下，RBE 會比較整個有效載荷對象，它將不斷變化。打開 RBE 節點，將 Property 從 payload 改為 payload.streaming。如果 payload 的 streaming值發生了變化，那么就把消息傳遞過去，否則就丟棄。

最后一步是將 “Debug” 節點的輸出從 msg.payload 改為完整的 msg 對象。這使我們能夠看到整個對象，有時在 payload 之外還有有用的信息。

現在，單擊 “Deploy” 以激活更改。希望 WebSocket 節點下面會有綠色的 Connected 消息。如果它們是紅色或黃色的，則連接 URL 可能不正確，需要更新，或者連接被阻止。請確保遠程機器上的 4444 端口是開放的、可用的，并且 OBS 正在運行!

如果沒有 RBE 節點對 streaming 值的過濾，調試面板（點擊畫布右側的“蟲子”圖標）大約現在就會被心跳消息填滿。點擊 “Inject” 節點左邊的按鈕，發送一個模擬按鈕點擊的信號。如果一切順利，你應該會看到一個對象到達，它有一個 obs-websocket 可以做的所有事情的列表。

對 “GetVersion” 的回應

現在在另一個標簽或窗口中打開 http://localhost:1880/ui。它應該顯示一個單一的按鈕。按下它! 調試面板應該會顯示和之前一樣的信息。

恭喜你！你已經發送了你的第一個（希望不是最后一個）WebSocket 消息！

這只是使用 obs-websockets 和 Node-RED 可以做的事情的起步。支持的完整文檔記錄在 obs-websockets 的 GitHub 倉庫的 protocol.md 文件中。通過一點點的實驗，你可以創建一個功能齊全的控制面板來啟動和停止流媒體、改變場景，以及更多。如果你和我一樣，在意識到之前，你就可以設置好各種控件了。

如此多的能力讓我有點瘋