MQTT WS HMI 與 Wokwi ESP32 連線的資訊透過HiveMQ

MQTT WS HMI 與 Wokwi ESP32 連線的資訊透過HiveMQ  

 https://console.hivemq.cloud/clusters

當您進入 HiveMQ Cloud Console 的 Clusters 頁面時，您的目標是取得能讓 MQTT WS HMI 與 Wokwi ESP32 成功連線的資訊。

根據您之前的設定需求，請在該頁面確認以下幾項重要資訊：

1. 取得 Cluster 網址 (Host)

在該頁面中，您會看到一個類似 4e79c52...hivemq.cloud 的網址。請複製這個網址，它必須分別填入：

• Wokwi 程式碼中 的 mqtt_server 變數。

• HMI 編輯器中 的「伺服器位址」欄位。

2. 設定存取權限 (Access Management)

HiveMQ Cloud 強制要求驗證，您必須在 Cluster 頁面中的 "Access Management" 標籤下建立帳號密碼：

• 請確認您已經建立了使用者名稱（例如 alex9ufo）與密碼（例如 Alex9ufo6662594）。

• 注意： 您在 Wokwi 程式碼中填寫的 mqtt_user 與 mqtt_pass 必須與這裡設定的一模一樣。

3. Port (通訊埠) 的區分

在 HiveMQ Cloud 中，不同連線方式使用的 Port 不同，請務必分開設定：

• Wokwi ESP32 (MQTT over TLS): 使用 Port 8883。

• MQTT WS HMI (WebSocket over TLS): 使用 Port 8884。

---

💡 在 HiveMQ Console 檢查連線的方法

如果您不確定系統是否真的有連上雲端，您可以點擊 Cluster 頁面中的 "Web Client" 按鈕：

1. 使用剛才建立的帳密登入 Web Client。

2. 點擊 "Add New Topic Subscription"，輸入 alex9ufo/hmi/#。

3. 測試： 在 Wokwi 執行模擬或在 HMI 按下按鈕，如果這個 Web Client 視窗出現訊息，代表您的連線路徑完全正確！

WOKWI ESP32程式

#include <WiFi.h>

#include <WiFiClientSecure.h>

#include <PubSubClient.h>

#include "DHTesp.h"

// 1. 網路與 HiveMQ 資訊

const char* ssid = "Wokwi-GUEST";

const char* password = "";

const char* mqtt_server = "4e79c527f1a8c244deb68528ee32b510e4.s1.eu.hivemq.cloud";

const int mqtt_port = 8883;

// 請在此輸入您在 HiveMQ Access Management 設定的帳號密碼

const char* mqtt_user = "alex9ufo";

const char* mqtt_pass = "aaaa66rdw2594";

// 2. 硬體腳位設定 (對應您的配線圖)

const int DHT_PIN = 15;

const int LED_PIN = 2; // 根據圖中綠線連接 D2

DHTesp dhtSensor;

WiFiClientSecure espClient;

PubSubClient client(espClient);

unsigned long lastMsg = 0;

void setup_wifi() {

  delay(10);

  Serial.println("Connecting to WiFi...");

  WiFi.begin(ssid, password);

  while (WiFi.status() != WL_CONNECTED) {

    delay(500);

    Serial.print(".");

  }

  Serial.println("\nWiFi connected");

 

  // HiveMQ Cloud 強制要求加密，跳過憑證驗證 (簡單測試用)

  espClient.setInsecure();

}

void callback(char* topic, byte* payload, unsigned int length) {

  String message;

  for (int i = 0; i < length; i++) {

    message += (char)payload[i];

  }

  Serial.print("Message arrived [");

  Serial.print(topic);

  Serial.print("] ");

  Serial.println(message);

  // 控制 LED On/Off

  if (String(topic) == "alex/led/control") {

    if (message == "1" || message == "ON") {

      digitalWrite(LED_PIN, HIGH);

      client.publish("alex/led/status", "1");

    }

    if (message == "0" || message == "OFF") {

      digitalWrite(LED_PIN, LOW);

      client.publish("alex/led/status", "0");

    }

  }

}

void reconnect() {

  while (!client.connected()) {

    Serial.print("Attempting MQTT connection...");

    // 建立唯一的 Client ID

    String clientId = "ESP32Client-" + String(random(0xffff), HEX);

    if (client.connect(clientId.c_str(), mqtt_user, mqtt_pass)) {

      Serial.println("connected");

      client.subscribe("alex/led/control"); // 訂閱控制指令

    } else {

      Serial.print("failed, rc=");

      Serial.print(client.state());

      Serial.println(" try again in 5 seconds");

      delay(5000);

    }

  }

}

void setup() {

  Serial.begin(115200);

  pinMode(LED_PIN, OUTPUT);

  dhtSensor.setup(DHT_PIN, DHTesp::DHT22);

 

  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;

    TempAndHumidity data = dhtSensor.getTempAndHumidity();

   

    String tempStr = String(data.temperature, 2);

    String humStr = String(data.humidity, 1);

   

    Serial.println("Publishing: T:" + tempStr + " H:" + humStr);

   

    client.publish("alex/sensor/temp", tempStr.c_str());

    client.publish("alex/sensor/hum", humStr.c_str());

  }

}