Node-RED: 透過 WebSockets 連接到 MQTT

此文件屬於MQTT 伺服器指南的一部分。請在此處查看完整指南：如何將 Node-RED 連接到 Mosquitto MQTT 伺服器。

歡迎瀏覽 Stackhero 文件

Stackhero 為您提供一個全託管的 Node-RED cloud 環境，助您迅速建立自動化流程：

• 內置 MQTT 伺服器（Mosquitto），輕鬆整合 IoT。
• 完整存取 Node-RED 管理介面，方便管理流程及設定。
• 包含 Node-RED Dashboard，即時數據可視化。
• 專屬 SMTP 電郵伺服器，發送無限制。
• 輕鬆 一鍵更新，確保您的實例保持最新。
• 自訂網域名稱，自動啟用 HTTPS：例如 https://node-red.your-company.com。
• 高 效能 及強大 安全性，採用專屬私有基礎設施。

您只需約 5 分鐘，即可擁有一個安全、適合生產環境的 Node-RED cloud hosting 實例。Stackhero 會為您處理安裝、更新及基礎設施管理，讓您專注於自動化流程的開發。

您可以選擇使用 MQTT 協議或 WebSockets 連接到 Mosquitto MQTT 伺服器。

雖然 MQTT 協議輕量且非常適合 IoT 裝置，但它並未被瀏覽器原生支援。如果您希望從瀏覽器與 MQTT 伺服器互動，建議使用 WebSockets。這種方式可將 MQTT 流量封裝在 WebSocket 協議中，並可與 Stackhero 的服務無縫配合。

要啟用 WebSocket 連線，只需在 Stackhero 控制台啟用「WebSocket Support」選項。啟用後，您可以將客戶端設定為使用 WebSocket URL：wss://<XXXXXX>.stackhero-network.com:443/mqtt。請確保將預設的 mqtts://<XXXXXX>.stackhero-network.com 替換為此 WebSocket URL，以便瀏覽器端連線。

選擇 MQTT 程式庫

在開發時，您可能會發現「MQTT.js」程式庫特別有用。這是一個功能強大的 JavaScript 程式庫，兼容 Node.js 及瀏覽器環境。您可以參考其官方儲存庫以獲取更多資訊。

透過 WebSockets 從瀏覽器連接 MQTT 的範例

如果您需要一個實際範例，說明如何從瀏覽器透過 WebSockets 連接到 MQTT 伺服器，可以參考這個儲存庫：https://github.com/stackhero-io/mqttWebSocketGettingStarted。您可以根據自己的設定，自行修改 src/index.html 檔案中的 url、username 和 password。

MQTT WebSocket 範例

在嘗試此設定前，請先確認已在 Stackhero 控制台啟用 WebSocket 支援。這樣可確保瀏覽器端連線順利運作。