t4_b2 - Wokwi ESP32, STM32, Arduino Simulator

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

// Khởi tạo LCD với địa chỉ I2C 0x27 và kích thước 20x4
LiquidCrystal_I2C lcd(0x27, 20, 4);

const char* MQTTServer = "broker.emqx.io";
const char* MQTT_Topic = "21004175_lcd";
const char* MQTT_ID = "ed77732d-be73-4e1a-a2f3-dd0fcda23684";
int Port = 1883;

WiFiClient wifiClient;
PubSubClient client(wifiClient);

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");
  Serial.print(", 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");
      Serial.println("");
      client.subscribe(MQTT_Topic); 
    } 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) {
  // Chuyển đổi thông điệp thành chuỗi
  String messageTemp;
  for (int i = 0; i < length; i++) {
    messageTemp += (char)message[i];
  }
  Serial.print("Message arrived [");
  Serial.print(topic);
  Serial.print("]: ");
  Serial.println(messageTemp);

  // Hiển thị nội dung lên màn hình LCD
  lcd.clear();
  lcd.setCursor(0, 0);
  lcd.print(messageTemp);
  
  // Cuộn văn bản nếu quá dài
  if (messageTemp.length() > 20) {
    for (int i = 0; i < messageTemp.length() - 20; i++) {
      lcd.scrollDisplayLeft();
      delay(100);
    }
  }
}

void setup() {
  Serial.begin(115200);
  WIFIConnect();
  client.setServer(MQTTServer, Port);
  client.setCallback(callback);
  
  // Khởi tạo màn hình LCD
  lcd.init();
  lcd.backlight();
  
}

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







































// <!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">
//     <title>ỨNG DỤNG QUẢN LÝ MÀN HÌNH THÔNG BÁO THÔNG MINH</title>
//     <script src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.1/mqttws31.min.js" type="text/javascript"></script>
//     <style>
//         body {
//             font-family: Arial, sans-serif;
//             text-align: center;
//             margin-top: 50px;
//         }
//         #input-container {
//             margin: 20px;
//         }
//         textarea {
//             width: 80%;
//             height: 100px;
//         }
//         button {
//             font-size: 1em;
//             padding: 10px 20px;
//             background-color: red;
//             color: white;
//             border: none;
//             cursor: pointer;
//         }
//         button:hover {
//             background-color: darkred;
//         }
//     </style>
// </head>
// <body>
//     <h1>ỨNG DỤNG QUẢN LÝ MÀN HÌNH THÔNG BÁO THÔNG MINH</h1>
//     <div id="input-container">
//         <label for="message">Nhập nội dung cần hiển thị (tiếng việt không dấu):</label><br>
//         <textarea id="message" ></textarea><br>
//         <button onclick="sendMessage()">Gửi và hiển thị lên thiết bị</button>
//     </div>

//     <script>
//         // Create a client instance
//         const client = new Paho.MQTT.Client("broker.emqx.io", Number(8083), "");

//         // Set callback handlers
//         client.onConnectionLost = onConnectionLost;
//         client.onMessageArrived = onMessageArrived;

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

//         // Called when the client connects
//         function onConnect() {
//             console.log("Connected to MQTT broker");
//             // Subscribe to the topic
//             client.subscribe("sent");
//         }

//         // Called when the client loses its connection
//         function onConnectionLost(responseObject) {
//             if (responseObject.errorCode !== 0) {
//                 console.log("onConnectionLost: " + responseObject.errorMessage);
//             }
//         }

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

//         // Send message to MQTT broker
//         function sendMessage() {
//             const messageText = document.getElementById("message").value;
//             if (messageText.trim() === "") {
//                 alert("Vui lòng nhập nội dung tin nhắn.");
//                 return;
//             }
//             const message = new Paho.MQTT.Message(messageText);
//             message.destinationName = "21004175_lcd";
//             client.send(message);
//             alert("Tin nhắn đã được gửi!");
//         }
//     </script>
// </body>
// </html>