Series
Lập Trình ESP32 Cơ Bản
  1. Series Lập Trình ESP32 Cơ Bản – Giới Thiệu: Lộ Trình 19 Bài Từ Số 0
  2. 1Lập trình ESP32 – Bài 1: ESP32 là gì? Hướng dẫn bắt đầu với ESP32 cho người mới
  3. 2Lập trình ESP32 – Bài 2: Kết nối WiFi và kiểm tra Internet với ESP32
  4. 3Lập trình ESP32 – Bài 3: Đọc nút nhấn và điều khiển LED với ESP32
  5. 4Lập trình ESP32 – Bài 4: Đọc nhiệt độ & độ ẩm với cảm biến DHT11
  6. 5Lập trình ESP32 – Bài 5: ESP32 Web Server – Điều khiển LED qua trình duyệt
  7. 6Lập trình ESP32 – Bài 6: Điều khiển LED RGB
  8. 7Lập trình ESP32 – Bài 7: Điều khiển Relay qua Web Server
  9. 8Lập trình ESP32 – Bài 8: WebSocket – Điều khiển LED realtime từ trình duyệt
  10. 9Lập trình ESP32 – Bài 9: Đọc cảm biến ánh sáng (LDR) và hiển thị realtime qua WebSocket
  11. 10Lập trình ESP32 – Bài 10: Điều khiển Servo SG90 qua Web Server
  12. 11Lập trình ESP32 – Bài 11: Đọc các loại biến trở (Potentiometer / Analog Sensor)
  13. 12Lập trình ESP32 – Bài 12: Đọc cảm biến khoảng cách HC-SR04
  14. 13Lập trình ESP32 – Bài 13: ESP32 – Đọc cảm biến nhiệt độ, độ ẩm DHT11 và hiển thị dữ liệu realtime qua WebSocket
  15. 14Lập trình ESP32 – Bài 14: Hiển thị màn hình TFT (SPI)
  16. 15Lập trình ESP32 – Bài 15: Màn hình OLED SSD1306 (I2C)
  17. 16Lập trình ESP32 – Bài 16: Module SIM 4G A7680C – Gọi điện thoại, in thông tin SIM/Module, trạng thái 4G
  18. 17Lập trình ESP32 – Bài 17: Phát nhạc MP3 với module DFPlayer Mini
  19. 18Lập trình ESP32 – Bài 18: Đọc cảm biến khí gas MQ-2 và hiển thị lên màn hình OLED
  20. 19Lập trình ESP32 – Bài 19: Kết nối MQTT, Publish dữ liệu cảm biến & Subscribe điều khiển thiết bị
Kiến thức

Lập trình ESP32 – Bài 7: Điều khiển Relay qua Web Server

Th11 2025
Lập trình ESP32 – Bài 7: Điều khiển Relay qua Web Server

Hướng dẫn cách kết nối Relay module với ESP32 và điều khiển bật/tắt thiết bị điện từ trình duyệt qua Web Server.

Mục lục

  1. Giới thiệu
  2. Relay là gì và nguyên lý hoạt động
  3. Phần cứng cần chuẩn bị
  4. Sơ đồ kết nối
  5. Mã nguồn điều khiển Relay
  6. Giải thích mã
  7. Kết quả chạy thử
  8. Lưu ý an toàn
  9. Gợi ý mở rộng

1) Giới thiệu

Relay là linh kiện quan trọng trong các ứng dụng nhà thông minh (Smart Home), cho phép ESP32 điều khiển thiết bị 220V AC như đèn, quạt, máy bơm…
Bài này hướng dẫn bạn:

  • Kết nối Relay module với ESP32
  • Tạo Web Server để bật/tắt thiết bị qua WiFi

2) Relay là gì và nguyên lý hoạt động

Relay là công tắc điện tử điều khiển bằng tín hiệu logic.

  • Khi GPIO của ESP32 ở mức LOW/HIGH, Relay sẽ đóng hoặc ngắt mạch điện xoay chiều.
  • Relay module có đèn LED báo trạng thái, chân IN, VCC, GND.
  • Nhiều module có cách kích khác nhau: LOW trigger hoặc HIGH trigger.

3) Phần cứng cần chuẩn bị

Linh kiệnSố lượngGhi chú
ESP32 DevKit V11
Relay module 1 kênh15V (hoạt động tốt với tín hiệu 3.3V)
Dây nốiVài sợi
Breadboard1Khuyến khích
Bóng đèn 220V + ổ cắm1Dùng khi demo thực tế (cẩn thận điện áp cao!)

4) Sơ đồ kết nối (Connection Diagram)

  • Relay VCC → 5V
  • Relay GND → GND
  • Relay IN → GPIO26 (tùy chọn)
  • ESP32 cấp nguồn qua USB
  • Relay COM/NO → tải 220V (chỉ khi test cẩn thận với nguồn cách ly)

5) Mã nguồn điều khiển Relay

#include <WiFi.h>
#include <WebServer.h>

#define RELAY_PIN 26  // chân điều khiển Relay

const char* ssid     = "YourWiFiName";
const char* password = "YourPassword";

WebServer server(80);
bool relayState = false;

const char HTML_PAGE[] PROGMEM = R"HTML(
<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>ESP32 - Relay Control</title>
<style>
body { font-family: system-ui; text-align:center; padding:30px;}
h1 { color:#0f766e;}
button { padding:14px 28px; margin:10px; font-size:18px; border:none; color:#fff; cursor:pointer;}
.on{background:#10b981;} .off{background:#ef4444;}
</style>
</head>
<body>
<h1>ESP32 Relay Control</h1>
<p>Relay state: <span id="state">--</span></p>
<button class="on" onclick="fetch('/on')">TURN ON</button>
<button class="off" onclick="fetch('/off')">TURN OFF</button>
<script>
async function refresh(){
  const r = await fetch('/state'); const s = await r.text();
  document.getElementById('state').textContent = s;
}
setInterval(refresh, 1500); refresh();
</script>
</body></html>
)HTML";

void handleRoot(){ server.send_P(200, "text/html", HTML_PAGE); }
void handleOn(){ relayState=true; digitalWrite(RELAY_PIN, HIGH); server.send(200,"text/plain","ON"); }
void handleOff(){ relayState=false; digitalWrite(RELAY_PIN, LOW); server.send(200,"text/plain","OFF"); }
void handleState(){ server.send(200,"text/plain", relayState ? "ON" : "OFF"); }

void setup(){
  Serial.begin(115200);
  pinMode(RELAY_PIN, OUTPUT);
  digitalWrite(RELAY_PIN, LOW);

  WiFi.begin(ssid, password);
  Serial.print("Connecting WiFi");
  while(WiFi.status()!=WL_CONNECTED){ delay(500); Serial.print("."); }
  Serial.println("\n✅ WiFi connected: " + WiFi.localIP().toString());

  server.on("/", handleRoot);
  server.on("/on", handleOn);
  server.on("/off", handleOff);
  server.on("/state", handleState);
  server.begin();
  Serial.println("✅ Web Server started");
}

void loop(){ server.handleClient(); }

6) Giải thích mã

  • digitalWrite(RELAY_PIN, HIGH/LOW) → bật hoặc tắt Relay.
  • Giao diện web gửi request tới /on, /off, /state.
  • HTML cập nhật trạng thái mỗi 1.5 giây.
  • relayState giữ trạng thái hiện tại của Relay.

7) Kết quả chạy thử

  • Mở Serial Monitor, xem địa chỉ IP của ESP32.
  • Mở trình duyệt → truy cập: http://<ESP32_IP>
  • Nhấn TURN ON / TURN OFF, nghe tiếng “tách” từ Relay và xem LED báo sáng/tắt.

8) Lưu ý an toàn ⚠️

  • Relay module chỉ nên dùng điều khiển tải điện thấp (LED, quạt mini) khi học.
  • Nếu cần điều khiển thiết bị 220V, hãy dùng nguồn cách ly hoặc relay quang (Optocoupler).
  • Tuyệt đối không chạm tay vào mạch 220V khi đang cấp điện!

9) Gợi ý mở rộng

  • Thêm WebSocket để cập nhật trạng thái realtime.
  • Lưu trạng thái Relay vào EEPROM hoặc SPIFFS để khởi động lại không mất trạng thái.
  • Dùng giao diện điều khiển nhiều Relay (4 kênh, 8 kênh).
  • Tích hợp với Google Home / MQTT / Home Assistant.