FUXA 是一款基於 Web 的開源工業視覺化軟體（SCADA/HMI），能讓使用者透過瀏覽器快速搭建工業監控儀表板、連線 PLC 設備與物聯網裝置。
核心操作 5 大步驟
要讓 FUXA 成功運作並顯示數據，請遵循以下核心流程：
1. 配置設備連線（Devices）
- 點擊介面左側或上方的 Devices（設備）。
- 新增連線並選擇您的通訊協議。FUXA 支援 Modbus RTU/TCP、Siemens S7、OPC UA、MQTT、BACnet 等多種工業與 IoT 協議。
- 輸入設備的 IP 位址、連接埠（Port）或 Broker 資訊。
2. 建立變數標籤（Tags）
- 在已連線的設備下方建立 Tags。
- 設定標籤名稱，並對應實際設備的記憶體位址（例如 Modbus 的 Holding Register
40001，或 MQTT 的 Topichome/sensor/temp）。 - 設定資料型態（如 INT、FLOAT、BOOLEAN）。
3. 繪製 HMI 視覺化介面（Views）
- 切換到 Views（視圖）編輯器。
- 利用內建的豐富元件庫，將數值顯示框、儀表板、開關按鈕、趨勢圖表（Charts）、泵浦/風扇圖示拖放至畫布中。
4. 綁定資料變數（Tag Binding）
- 點擊畫布上的元件（例如一個溫度計圖表）。
- 在右側屬性面板中，找到資料來源設定，並將其綁定（Bind）到您在步驟 2 建立的 Tag。
- 如此一來，當底層設備的數據變動時，網頁圖表就會即時更新。
5. 設定報警與定時任務（Alarms & Scripts）
- Alarms：可設定當某個 Tag 超過設定值（如溫度 > 80 度）時觸發報警，並記錄在系統中。
- Scripts / Text：支援編寫 JavaScript 邏輯，可用來處理複雜的資料轉換或執行定時任務。
Windows 安裝步驟
- 前往 Node.js 官方網站。
- 點擊 LTS 版本的安裝按鈕下載
.msi檔案。 - 開啟下載的檔案，依據安裝精靈的指示（一路點擊「Next」或「下一步」）完成安裝。
安裝完成後，開啟您的終端機（Terminal）或命令提示字元（cmd），輸入以下指令檢查版本：
- 檢查 Node.js 是否安裝成功：
node -v - 檢查 npm 是否安裝成功：
npm -v
透過 Node.js (NPM) 安裝
使用 node.js (建議 v18.x) 安裝： 進入cmd 命令模式
- 安裝環境：執行
npm install -g @frangoteam/fuxa-min。 - 啟動服務：輸入
fuxa。
要啟動 FUXA，您可以根據您的安裝方式選擇對應的指令：
🖥️ 本地或 Desktop 安裝
- 執行程式：雙擊桌面 FUXA 圖示，系統會自動啟動後台服務。 [1]
- 開啟網頁：打開瀏覽器，輸入：
http://localhost:1881 或http://127.0.0.1:1881/ - 預設登入：
- 帳號：
admin - 密碼：
admin
- 帳號：
FUXA設定
WOKWI ESP32 程式
#include <WiFi.h>
#include <PubSubClient.h>
#include <DHT.h>
// Wi-Fi 設定 (Wokwi 虛擬環境專用)
const char* ssid = "Wokwi-GUEST";
const char* password = "";
// MQTT Broker 設定 (使用 EMQX 公共伺服器)
const char* mqtt_server = "broker.emqx.io";
const int mqtt_port = 1883;
// 定義 MQTT 主題 (已更新為 alex9ufo 專屬代稱)
const char* topic_led = "alex9ufo/esp32/led";
const char* topic_temp = "alex9ufo/esp32/temp";
const char* topic_hum = "alex9ufo/esp32/hum";
#define DHTPIN 15
#define DHTTYPE DHT22
#define LED_PIN 2
DHT dht(DHTPIN, DHTTYPE);
WiFiClient espClient;
PubSubClient client(espClient);
unsigned long lastMsg = 0;
void setup_wifi() {
delay(10);
Serial.println("\nConnecting to WiFi...");
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println("\nWiFi connected!");
}
// 接收來自網頁端的指令
void callback(char* topic, byte* payload, unsigned int length) {
String message = "";
for (int i = 0; i < length; i++) {
message += (char)payload[i];
}
Serial.print("收到主題 ["); Serial.print(topic); Serial.print("] 的訊息: "); Serial.println(message);
if (String(topic) == topic_led) {
if (message == "ON") {
digitalWrite(LED_PIN, HIGH);
} else if (message == "OFF") {
digitalWrite(LED_PIN, LOW);
}
}
}
void reconnect() {
while (!client.connected()) {
Serial.print("嘗試 MQTT 連線...");
String clientId = "ESP32Client-" + String(random(0, 10000));
if (client.connect(clientId.c_str())) {
Serial.println("已連線!");
client.subscribe(topic_led); // 訂閱 LED 控制主題
} else {
Serial.print("失敗, rc="); Serial.print(client.state());
Serial.println(" 5秒後重試");
delay(5000);
}
}
}
void setup() {
Serial.begin(115200);
pinMode(LED_PIN, OUTPUT);
dht.begin();
setup_wifi();
client.setServer(mqtt_server, mqtt_port);
client.setCallback(callback);
}
void loop() {
if (!client.connected()) {
reconnect();
}
client.loop();
// 每 5 秒定時發送一次溫濕度數據
unsigned long now = millis();
if (now - lastMsg > 5000) {
lastMsg = now;
float h = dht.readHumidity();
float t = dht.readTemperature();
if (!isnan(h) && !isnan(t)) {
client.publish(topic_temp, String(t).c_str());
client.publish(topic_hum, String(h).c_str());
Serial.printf("已上傳 - 溫度: %.1f °C, 濕度: %.1f %%\n", t, h);
}
}
}
