2024年4月21日 星期日

Wokwi ESP32 Simulator : ESP32 + DHT22+MQTT+ Node-RED Dashboard

來源  https://www.youtube.com/watch?v=V55AebUq53g

 https://wokwi.com/projects/395836744487046145














ESP32程式

#include <WiFi.h> 

#include <PubSubClient.h>

#include <DHTesp.h>


const int DHT_PIN = 15

DHTesp dht;

const char* ssid = "Wokwi-GUEST";

const char* password = "";

const char* mqtt_server = "test.mosquitto.org";


WiFiClient espClient;

PubSubClient client(espClient);

unsigned long lastMsg = 0;

float temp = 0;

float hum = 0;


void setup_wifi() {

 delay(10);

 Serial.println();

 Serial.print("Connecting to ");

 Serial.println(ssid);


 WiFi.mode(WIFI_STA);

 WiFi.begin(ssid, password);


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

   delay(500);

   Serial.print(".");

 }


 randomSeed(micros());


 Serial.println("");

 Serial.println("WiFi connected");

 Serial.println("IP address: ");

 Serial.println(WiFi.localIP());

}

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

 Serial.print("Message arrived [");

 Serial.print(topic);

 Serial.print("] ");

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

   Serial.print((char)payload[i]);

 }}

void reconnect() {

 while (!client.connected()) {

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

   String clientId = "ESP32Client-";

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

   if (client.connect(clientId.c_str())) {

     Serial.println("Connected");

     client.publish("/ThinkIOT/Publish", "Welcome");

     client.subscribe("/ThinkIOT/Subscribe");

   } else {

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

     Serial.print(client.state());

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

     delay(5000);

   }}

}

void setup() {

 pinMode(2, OUTPUT);    

 Serial.begin(115200);

 setup_wifi();

 client.setServer(mqtt_server, 1883);

 client.setCallback(callback);

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

}

void loop() {

 if (!client.connected()) {

   reconnect();

 }

 client.loop();


 unsigned long now = millis();

 if (now - lastMsg > 2000) { 

   lastMsg = now;

   TempAndHumidity  data = dht.getTempAndHumidity();


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

   client.publish("/ThinkIOT/temp", temp.c_str()); 

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

   client.publish("/ThinkIOT/hum", hum.c_str()); 


   Serial.print("Temperature: ");

   Serial.println(temp);

   Serial.print("Humidity: ");

   Serial.println(hum);

 }

}


WOKWI diagram.json程式

{
  "version": 1,
  "author": "Uri Shaked",
  "editor": "wokwi",
  "parts": [
    { "type": "wokwi-esp32-devkit-v1", "id": "esp", "top": 14.3, "left": -33.8, "attrs": {} },
    { "type": "wokwi-dht22", "id": "dht1", "top": -15.53, "left": 145.5, "attrs": {} }
  ],
  "connections": [
    [ "esp:TX0", "$serialMonitor:RX", "", [] ],
    [ "esp:RX0", "$serialMonitor:TX", "", [] ],
    [ "dht1:SDA", "esp:D15", "green", [ "v0" ] ],
    [ "dht1:VCC", "esp:3V3", "red", [ "v0" ] ],
    [ "dht1:GND", "esp:GND.1", "black", [ "v0" ] ]
  ],
  "dependencies": {}
}

Node-Red程式

[{"id":"15a75aa6241ed6c8","type":"mqtt in","z":"2ded2ffb8cb68caa","name":"","topic":"alex9ufo/ThinkIOT/temp","qos":"0","datatype":"auto-detect","broker":"603bb104.d6134","nl":false,"rap":true,"rh":0,"inputs":0,"x":440,"y":140,"wires":[["392d876a608d9f1f"]]},{"id":"960690c1464cda76","type":"mqtt in","z":"2ded2ffb8cb68caa","name":"","topic":"alex9ufo/ThinkIOT/hum","qos":"1","datatype":"auto-detect","broker":"603bb104.d6134","nl":false,"rap":true,"rh":0,"inputs":0,"x":440,"y":220,"wires":[["c87ae55313204029"]]},{"id":"392d876a608d9f1f","type":"ui_gauge","z":"2ded2ffb8cb68caa","name":"","group":"0a1ec636c707840f","order":0,"width":0,"height":0,"gtype":"gage","title":"gauge","label":"units","format":"{{value}}","min":0,"max":"100","colors":["#00b500","#e6e600","#ca3838"],"seg1":"30","seg2":"80","className":"","x":690,"y":140,"wires":[]},{"id":"c87ae55313204029","type":"ui_gauge","z":"2ded2ffb8cb68caa","name":"","group":"0a1ec636c707840f","order":1,"width":0,"height":0,"gtype":"gage","title":"gauge","label":"units","format":"{{value}}","min":0,"max":"100","colors":["#00b500","#e6e600","#ca3838"],"seg1":"50","seg2":"80","className":"","x":690,"y":220,"wires":[]},{"id":"603bb104.d6134","type":"mqtt-broker","name":"","broker":"broker.mqtt-dashboard.com","port":"1883","clientid":"","autoConnect":true,"usetls":false,"compatmode":false,"protocolVersion":"4","keepalive":"15","cleansession":true,"birthTopic":"","birthQos":"0","birthPayload":"","birthMsg":{},"closeTopic":"","closePayload":"","closeMsg":{},"willTopic":"","willQos":"0","willPayload":"","willMsg":{},"userProps":"","sessionExpiry":""},{"id":"0a1ec636c707840f","type":"ui_group","name":"TEMP/HUMI","tab":"b83c5c221c74411b","order":1,"disp":true,"width":"6","collapse":false,"className":""},{"id":"b83c5c221c74411b","type":"ui_tab","name":"Wokwi","icon":"dashboard","order":121,"disabled":false,"hidden":false}]

沒有留言:

張貼留言

Node-Red Dashboard UI Template + AngularJS 參考 AngularJS教學 --3

  Node-Red Dashboard UI Template + AngularJS 參考 AngularJS教學 --3 AngularJS 實例 <!DOCTYPE html> <html> <head> <meta charse...