如何用 OBS 和 WebSockets 播放視頻流
OBS 是現在視頻直播的主流之一。它是直播流媒體到 Twitch 的首選軟體,Twitch 是近來最受歡迎的視頻直播網站之一。有一些非常好的附加組件,可以讓流媒體人從他們的手機或另一個屏幕上進行控制,而不影響正在運行的視頻。事實證明,使用 Node-RED 和 obs-websockets 插件來構建自己的控制面板真的很容易。
![My OBS Control Dashboard](/data/attachment/album/202006/25/105223o99zegczi4gqxk2o.jpg "My OBS Control Dashboard")
我的 OBS 控制儀錶盤
我知道你們很多人在想什麼 —— 「他在同一句話中提到了 WebSockets 和簡單?」很多人在設置和使用 WebSockets 時遇到了困難,WebSockets 允許通過 Web 伺服器的單一連接進行雙向通信。Node-RED 內置了對 WebSockets 的支持,是讓這一切變得簡單的原因之一,至少與編寫自己的客戶端/伺服器相比是如此。
在開始之前,請確保你已經安裝和配置了 OBS。首先下載並安裝最新穩定版的 obs-websockets插件。對於本文來說,默認的設置就可以了,但我強烈建議你之後按照說明來保護 obs-websockets 的安全。
接下來,下載並安裝 Node-RED,可以在同一個系統上,也可以在不同的系統上(比如樹莓派)。同樣,默認的安裝對我們這篇文章來說是夠了,但最好按照他們網站上的指示進行安全安裝。
現在是有趣的部分。啟動 Node-RED,打開網頁界面(默認在 http://localhost:1880),你有了一個空白的畫布。打開右邊的「漢堡」菜單,選擇「 管理口味 」。然後點擊「安裝」標籤,搜索 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
![The basic flows](/data/attachment/album/202006/25/105226sqz8q8yv74htquet.jpg "The basic flows")
基本流程
當 「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 有效載荷發送到下一個節點。
![Setting up the button](/data/attachment/album/202006/25/105230grit864trxjq5rgi.jpg "Setting up the button")
設置 「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 Node configuration](/data/attachment/album/202006/25/105235wclh6swd2hxndhqc.jpg "Websocket Out Node configuration")
「Websocket Out」 節點配置
進入 「WebSocket In」 流程!打開 「WebSocket In」 節點,並對其設置 Type
為 Connect to
和我們之前定義的連接的 URL(應自動填充)。接下來是第二個 「JSON」 節點,我們可以不用管它。它接受 OBS 的輸出,並將其轉換為有效載荷對象。
接下來,我們將從中過濾出常規的心跳和狀態更新。打開 「Switch」,將 Property
值設置為 payload["update-type"]
。現在從它下面的下拉菜單中選擇 Is Not Null
。點擊 +
添加第二個選項,並從下拉菜單中選擇 otherwise
。
![Switch Node configuration](/data/attachment/album/202006/25/105238f4jq5jozmc4n4y4j.jpg "Switch Node configuration")
「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
可以做的所有事情的列表。
![The response to "GetVersion"](/data/attachment/album/202006/25/105255u3klqklw5uny6z3i.jpg "The response to "GetVersion"")
對 「GetVersion」 的回應
現在在另一個標籤或窗口中打開 http://localhost:1880/ui
。它應該顯示一個單一的按鈕。按下它! 調試面板應該會顯示和之前一樣的信息。
恭喜你!你已經發送了你的第一個(希望不是最後一個)WebSocket 消息!
這只是使用 obs-websockets 和 Node-RED 可以做的事情的起步。支持的完整文檔記錄在 obs-websockets 的 GitHub 倉庫的 protocol.md
文件中。通過一點點的實驗,你可以創建一個功能齊全的控制面板來啟動和停止流媒體、改變場景,以及更多。如果你和我一樣,在意識到之前,你就可以設置好各種控制項了。
![OBS Websocket](/data/attachment/album/202006/25/105300fm6pgegalhd6bvpx.jpg "OBS Websocket")
如此多的能力讓我有點瘋
via: https://opensource.com/article/20/6/obs-websockets-streaming
作者:Kevin Sonney 選題:lujun9972 譯者:wxy 校對:wxy
本文轉載來自 Linux 中國: https://github.com/Linux-CN/archive