# G1 28 - Tạo Web Control đơn giản trên ESP32 ## Cần chuẩn bị | Nhóm | Linh kiện / dụng cụ | Số lượng | Ghi chú | |---|---|---:|---| | Board | ESP32-S3 DevKit | 1 | Kết nối WiFi và chạy web server | | Robot base | Chassis 2WD, 2 motor DC, bánh xe, caster | 1 bộ | Đã kiểm tra lệnh Serial ở G1 27 | | Driver motor | TB6612FNG | 1 | Điều khiển hai motor | | Cảm biến khoảng cách | HC-SR04 | 1 | Echo qua chia áp hoặc level shifter | | Phản hồi | LED GPIO2, active buzzer GPIO15 | 1 mỗi loại | Báo lệnh và lỗi an toàn | | Nguồn | Pin robot đã sạc, công tắc nguồn motor | 1 bộ | Có thể tắt motor ngay khi web bị thao tác nhầm | | Mạng | Router WiFi hoặc hotspot điện thoại | 1 mạng | ESP32 và thiết bị điều khiển phải cùng mạng | | Thiết bị điều khiển | Điện thoại hoặc máy tính có trình duyệt | 1 | Mở IP của ESP32 | | Phần mềm | Arduino IDE, Serial Monitor, cáp USB data | 1 bộ | Serial 115200 để xem IP và log | ## Bài này giúp bạn làm được gì? Ở G1 27, bạn điều khiển robot bằng lệnh Serial. Bài này đưa cùng ý tưởng sang trình duyệt: ESP32 kết nối WiFi, tạo một trang web nhỏ, và mỗi nút trên trang gửi một yêu cầu HTTP đến robot. Kết quả cuối bài: **điện thoại hoặc máy tính mở được trang Web Control của ESP32, bấm nút tiến/lùi/trái/phải/dừng, robot chạy ngắn rồi tự dừng và in log lệnh nhận được**. ## Mục tiêu bài học Sau bài này, bạn có thể: - Kết nối ESP32-S3 vào mạng WiFi lớp học hoặc hotspot. - Hiểu cách một nút web gửi lệnh HTTP đến robot. - Tái sử dụng lớp điều khiển motor an toàn từ bài Serial. - Đọc IP, RSSI và log HTTP trên Serial Monitor. - Nhận ra rủi ro của điều khiển qua mạng và thêm auto-stop. ## Pin map dùng trong bài | Chức năng | Chân ESP32-S3 | Module | |---|---|---| | HC-SR04 Trig | GPIO5 | HC-SR04 | | HC-SR04 Echo | GPIO18 qua chia áp | HC-SR04 | | LED trạng thái | GPIO2 | LED onboard/ngoài | | Buzzer | GPIO15 | Active buzzer | | STBY | GPIO33 | TB6612FNG | | Motor trái PWM/IN1/IN2 | GPIO25/GPIO26/GPIO27 | TB6612FNG | | Motor phải PWM/IN1/IN2 | GPIO14/GPIO12/GPIO13 | TB6612FNG | ## Luồng hoạt động ```text Trình duyệt mở địa chỉ IP của ESP32 → học viên bấm nút FWD/BACK/LEFT/RIGHT/STOP → ESP32 nhận HTTP request /cmd → parser kiểm tra hướng, tốc độ, thời gian → robot chạy ngắn, auto-stop, ghi log Serial ``` Trang web chỉ là nút bấm cơ bản. Bài này tập trung vào luồng điều khiển và an toàn, chưa cần giao diện đẹp. ## Thực hành từng bước 1. Sửa `WIFI_SSID` và `WIFI_PASSWORD` trong code. 2. Kê robot lên, upload code và mở Serial Monitor. 3. Chờ log `WiFi OK`, ghi lại địa chỉ IP. 4. Mở trình duyệt trên điện thoại hoặc máy tính cùng mạng, nhập IP đó. 5. Bấm `FWD`, quan sát bánh quay ngắn rồi dừng. 6. Đặt hộp giấy gần HC-SR04, bấm `FWD` và kiểm tra robot dừng an toàn. 7. Đặt robot xuống sân thử, bấm từng nút trong vùng an toàn. 8. Ghi lại IP, RSSI, lệnh đã bấm và kết quả thực tế. ## Code mẫu hoàn chỉnh ```cpp /* G1 28 - Web Control don gian tren ESP32 Board: ESP32-S3 DevKit + TB6612FNG + HC-SR04 */ #include #include const char *WIFI_SSID = "TenMangWiFi"; const char *WIFI_PASSWORD = "MatKhauWiFi"; const int PIN_TRIG = 5; const int PIN_ECHO = 18; const int PIN_LED = 2; const int PIN_BUZZER = 15; const int PIN_STBY = 33; const int L_PWM = 25; const int L_IN1 = 26; const int L_IN2 = 27; const int R_PWM = 14; const int R_IN1 = 12; const int R_IN2 = 13; const int DEFAULT_SPEED = 90; const unsigned long DEFAULT_MS = 500; const int MIN_SPEED = 50; const int MAX_SPEED = 130; const unsigned long MIN_MS = 100; const unsigned long MAX_MS = 1200; const float SAFE_FORWARD_CM = 20.0; const unsigned long SENSOR_INTERVAL_MS = 80; WebServer server(80); enum Motion { STOPPED, FWD, BACK, LEFT, RIGHT }; Motion motion = STOPPED; unsigned long motionEndsAt = 0; unsigned long lastSensorMs = 0; float distanceCm = -1.0; const char *motionName(Motion m) { switch (m) { case STOPPED: return "STOPPED"; case FWD: return "FWD"; case BACK: return "BACK"; case LEFT: return "LEFT"; case RIGHT: return "RIGHT"; } return "UNKNOWN"; } float readDistanceCm() { digitalWrite(PIN_TRIG, LOW); delayMicroseconds(2); digitalWrite(PIN_TRIG, HIGH); delayMicroseconds(10); digitalWrite(PIN_TRIG, LOW); unsigned long duration = pulseIn(PIN_ECHO, HIGH, 30000UL); if (duration == 0) return -1.0; float cm = duration * 0.0343 / 2.0; if (cm < 3.0 || cm > 150.0) return -1.0; return cm; } void setMotor(int pwmPin, int in1, int in2, int speed) { speed = constrain(speed, -255, 255); digitalWrite(in1, speed >= 0 ? HIGH : LOW); digitalWrite(in2, speed >= 0 ? LOW : HIGH); analogWrite(pwmPin, abs(speed)); } void drive(int leftSpeed, int rightSpeed) { setMotor(L_PWM, L_IN1, L_IN2, leftSpeed); setMotor(R_PWM, R_IN1, R_IN2, rightSpeed); } void stopRobot(const char *reason) { drive(0, 0); motion = STOPPED; digitalWrite(PIN_LED, LOW); Serial.print("event=STOP reason="); Serial.println(reason); } void updateSensor() { unsigned long now = millis(); if (now - lastSensorMs < SENSOR_INTERVAL_MS) return; lastSensorMs = now; distanceCm = readDistanceCm(); } void startMotion(const String &move, int speed, unsigned long durationMs) { updateSensor(); if (move == "fwd" && distanceCm > 0 && distanceCm <= SAFE_FORWARD_CM) { stopRobot("WEB_OBSTACLE_TOO_CLOSE"); digitalWrite(PIN_BUZZER, HIGH); delay(40); digitalWrite(PIN_BUZZER, LOW); return; } if (move == "fwd") { motion = FWD; drive(speed, speed); } else if (move == "back") { motion = BACK; drive(-speed, -speed); } else if (move == "left") { motion = LEFT; drive(-speed, speed); } else if (move == "right") { motion = RIGHT; drive(speed, -speed); } else { stopRobot("WEB_BAD_MOVE"); return; } motionEndsAt = millis() + durationMs; digitalWrite(PIN_LED, HIGH); Serial.print("event=WEB_MOVE move="); Serial.print(move); Serial.print(" speed="); Serial.print(speed); Serial.print(" duration_ms="); Serial.print(durationMs); Serial.print(" distance_cm="); Serial.println(distanceCm, 1); } String htmlPage() { return R"HTML( Gen 1 Robot Control

Gen 1 Robot Control

Use short commands. Keep the robot inside the test area.

FWD BACK LEFT RIGHT STOP

Status: /status

)HTML"; } void handleRoot() { server.send(200, "text/html", htmlPage()); } void handleStatus() { String body = "motion=" + String(motionName(motion)); body += " distance_cm=" + String(distanceCm, 1); body += " rssi=" + String(WiFi.RSSI()); server.send(200, "text/plain", body); } void handleCommand() { String move = server.arg("m"); move.toLowerCase(); int speed = server.hasArg("s") ? server.arg("s").toInt() : DEFAULT_SPEED; unsigned long durationMs = server.hasArg("t") ? server.arg("t").toInt() : DEFAULT_MS; if (move == "stop") { stopRobot("WEB_STOP"); server.send(200, "text/plain", "ok stop"); return; } speed = constrain(speed, MIN_SPEED, MAX_SPEED); durationMs = constrain(durationMs, MIN_MS, MAX_MS); startMotion(move, speed, durationMs); server.send(200, "text/plain", String("ok ") + move); } void setup() { Serial.begin(115200); pinMode(PIN_TRIG, OUTPUT); pinMode(PIN_ECHO, INPUT); pinMode(PIN_LED, OUTPUT); pinMode(PIN_BUZZER, OUTPUT); pinMode(PIN_STBY, OUTPUT); pinMode(L_PWM, OUTPUT); pinMode(L_IN1, OUTPUT); pinMode(L_IN2, OUTPUT); pinMode(R_PWM, OUTPUT); pinMode(R_IN1, OUTPUT); pinMode(R_IN2, OUTPUT); digitalWrite(PIN_STBY, HIGH); stopRobot("BOOT"); WiFi.mode(WIFI_STA); WiFi.begin(WIFI_SSID, WIFI_PASSWORD); Serial.println("Connecting WiFi..."); while (WiFi.status() != WL_CONNECTED) { delay(300); Serial.print("."); } Serial.println(); Serial.print("WiFi OK IP="); Serial.println(WiFi.localIP()); server.on("/", handleRoot); server.on("/cmd", handleCommand); server.on("/status", handleStatus); server.begin(); Serial.println("Web server ready"); } void loop() { server.handleClient(); updateSensor(); if (motion == FWD && distanceCm > 0 && distanceCm <= SAFE_FORWARD_CM) { stopRobot("OBSTACLE_DURING_FORWARD"); } if (motion != STOPPED && millis() >= motionEndsAt) { stopRobot("TIME_DONE"); } } ``` ## Giải thích code theo từng khối - `WiFi.begin()` kết nối ESP32 vào mạng thật, sau đó in IP lên Serial. - `WebServer server(80)` tạo web server HTTP trên cổng 80. - Trang `/` trả về nút điều khiển. - Nút bấm gửi đến `/cmd?m=fwd&s=90&t=500`. - `handleCommand()` kiểm tra hướng, tốc độ và thời gian trước khi chạy motor. - `/status` giúp kiểm tra robot đang làm gì và tín hiệu WiFi mạnh hay yếu. ## Kiểm thử robot thật | Lần thử | Thao tác | Kết quả mong đợi | |---:|---|---| | 1 | Mở Serial Monitor | Thấy `WiFi OK IP=...` | | 2 | Mở IP trên điện thoại | Thấy trang có nút điều khiển | | 3 | Bấm `FWD` khi kê bánh | Bánh quay ngắn rồi dừng | | 4 | Bấm `STOP` | Robot dừng ngay | | 5 | Đặt hộp giấy gần cảm biến rồi bấm `FWD` | Robot không tiến hoặc dừng ngay | ## Lỗi thường gặp và cách sửa | Lỗi | Nguyên nhân hay gặp | Cách sửa | |---|---|---| | Không thấy IP | Sai tên WiFi/mật khẩu | Kiểm tra lại `WIFI_SSID`, `WIFI_PASSWORD` | | Điện thoại không mở được trang | Không cùng mạng với ESP32 | Kết nối cùng router/hotspot | | Bấm nút nhưng robot không chạy | Chưa bật nguồn motor hoặc STBY sai | Đo nguồn VM, kiểm tra GND chung | | Robot phản hồi trễ | WiFi yếu hoặc nhiều thiết bị | Đưa robot gần router, xem `RSSI` trong `/status` | ## Checklist debug - [ ] Serial in được địa chỉ IP. - [ ] Trình duyệt mở được trang điều khiển. - [ ] `/status` trả về motion, distance và RSSI. - [ ] Mỗi nút chạy đều auto-stop. - [ ] Robot dừng khi vật cản gần. ## Thử thách nhỏ Thêm nút `SLOW FWD` dùng `/cmd?m=fwd&s=60&t=400`. So sánh điều khiển tốc độ 60 và 90 trên cùng một sân thử. ## Checklist hoàn thành - [ ] Robot nhận lệnh từ web trên mạng thật. - [ ] Có log HTTP command trên Serial. - [ ] Robot không chạy vượt thời gian. - [ ] Có bảng kiểm thử nút web và video demo robot thật. - [ ] Biết đọc IP và RSSI để debug kết nối. ## Bài tiếp theo G1 29 sẽ gom các lệnh Serial và web về một parser an toàn hơn, kiểm tra cú pháp trước khi bất kỳ lệnh nào được phép làm motor chạy. --- ## Điều hướng bài học **Bài tiếp theo:** G1 29 - Command parser và kiểm tra lệnh an toàn **Bài trước:** G1 27 - Điều khiển robot qua Serial an toàn

Tạo Web Control đơn giản trên ESP32

Ghi danh khóa học để mở bài này