Wokwi - Online ESP32, STM32, Arduino Simulator

#include <WiFi.h>
#include "PubSubClient.h"

const char *MQTTServer = "broker.hivemq.com";
const char *MQTT_Topic = "vlute/den1";
const char *MQTT_ID = ""; 
int Port = 1883;
String stMessage = "";

WiFiClient espClient;
PubSubClient client(espClient);

const int led[] = {19, 18, 5, 17}; 

void WIFIConnect() {
    Serial.println("Connecting to SSID: Wokwi-GUEST");
    WiFi.begin("Wokwi-GUEST", "");
    while (WiFi.status() != WL_CONNECTED) {
        delay(500);
        Serial.print(".");
    }
    Serial.println("");
    Serial.print("WiFi connected, IP address: ");
    Serial.println(WiFi.localIP());
}

void MQTT_Reconnect() {
    while (!client.connected()) {
        if (client.connect(MQTT_ID)) {
            Serial.print("MQTT Topic: ");
            Serial.print(MQTT_Topic);
            Serial.print(" connected");
            client.subscribe(MQTT_Topic);
            Serial.println("");
        } else {
            Serial.print("failed, rc=");
            Serial.print(client.state());
            Serial.println(" try again in 5 seconds");
            delay(5000);
        }
    }
}

void callback(char* topic, byte* message, unsigned int length) {
    Serial.print("Message arrived on topic: ");
    Serial.println(topic);
    Serial.print("Message: ");
    stMessage = ""; // Reset nội dung tin nhắn
    for (int i = 0; i < length; i++) {
        Serial.print((char)message[i]);
        stMessage += (char)message[i];
    }
    Serial.println();
}

void setup() {
    Serial.begin(115200);
    WIFIConnect();
    client.setServer(MQTTServer, Port);
    client.setCallback(callback);
    for (int i = 0; i < 4; i++) {
        pinMode(led[i], OUTPUT);
    }
}
//random
void loop() {
    delay(10);

    if (!client.connected()) {
        MQTT_Reconnect();
    }

    client.loop();

    if (stMessage == "on") {
        int randomLed = random(0, 4); 
        digitalWrite(led[randomLed], HIGH); 
        delay(300);
        digitalWrite(led[randomLed], LOW); 
    } else if (stMessage == "off") {
        for (int i = 0; i < 4; i++) {
            digitalWrite(led[i], LOW);
        }
    }
}




// <!DOCTYPE html>
// <html lang="en">
// <head>
//     <meta charset="UTF-8">
//     <meta http-equiv="X-UA-Compatible" content="IE=edge">
//     <meta name="viewport" content="width=device-width, initial-scale=1.0">
//     <script src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.1/mqttws31.min.js" type="text/javascript"></script>
//     <script src="https://code.jquery.com/jquery-3.6.1.min.js" type="text/javascript"></script>
// </head>
// <body>
//     <center>
//         <h1>ỨNG DỤNG ĐIỀU KHIỂN LED TỪ XA QUA MẠNG</h1>
//         <img class="bat" src="https://i.imgur.com/yRMydZv.png" id="batden">
//     </center>
// </body>
// </html>

// <script>
//     var anh_bat = "https://i.imgur.com/pPqLQx4.png";
//     var anh_tat = "https://i.imgur.com/yRMydZv.png";
//     var client = new Paho.MQTT.Client("broker.hivemq.com", Number(8000), "");

//     client.onConnectionLost = onConnectionLost;
//     client.onMessageArrived = onMessageArrived;

//     client.connect({ onSuccess: onConnect });

//     function onConnect() {
//         console.log("onConnect");
//         client.subscribe("VLUTE/LED");
//     }

//     function onConnectionLost(responseObject) {
//         if (responseObject.errorCode !== 0) {
//             console.log("onConnectionLost:" + responseObject.errorMessage);
//         }
//     }

//     function onMessageArrived(message) {
//         console.log("onMessageArrived:" + message.payloadString);
//     }

//     $('.bat').click(function () {
//         var anhht = $('.bat').attr('src');
//         if (anhht == anh_bat) {
//             $('.bat').attr('src', anh_tat);
//             tat();
//         } else {
//             $('.bat').attr('src', anh_bat);
//             bat();
//         }
//     });

//     function bat() {
//         var message = new Paho.MQTT.Message("on");
//         message.destinationName = "VLUTE/LED";
//         client.send(message);
//     }

//     function tat() {
//         var message = new Paho.MQTT.Message("off");
//         message.destinationName = "VLUTE/LED";
//         client.send(message);
//     }
// </script>