🌐

Giao Tiếp và Networking

Kết nối Arduino với thế giới! Học cách truyền nhận dữ liệu qua Serial, I2C, SPI, xây dựng web server, gửi dữ liệu lên cloud và điều khiển thiết bị từ xa qua WiFi/Bluetooth. Mở rộng khả năng sáng tạo không giới hạn.

⏱️ 120 phút🎯 Nâng cao

🎯 Mục Tiêu Bài Học

✓Hiểu các protocol giao tiếp (Serial, I2C, SPI)
✓Giao tiếp với devices qua I2C
✓Thiết lập WiFi communication với ESP32
✓Tạo web server đơn giản
✓Gửi dữ liệu lên cloud platforms

📡 Các Giao Thức Giao Tiếp

📡

Serial (UART)

Giao tiếp nối tiếp đơn giản, 2 dây (TX/RX)

Ứng dụng:

Debug, computer communication

Tốc độ:

9600 - 115200 baud

🔗

I2C (TWI)

Inter-Integrated Circuit, 2 dây (SDA/SCL)

Ứng dụng:

Sensors, displays, multiple devices

Tốc độ:

100kHz - 400kHz

⚡

SPI

Serial Peripheral Interface, 4 dây minimum

Ứng dụng:

High-speed devices, SD cards

Tốc độ:

Up to 10MHz+

📶

WiFi

Wireless networking với ESP32/ESP8266

Ứng dụng:

IoT, web servers, cloud connectivity

Tốc độ:

802.11 b/g/n

💻 Code Mẫu - ESP32 Web Server

esp32_web_server.ino

/*
  ESP32 Web Server với Sensor Data
  Tạo web interface để hiển thị dữ liệu sensors
*/

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

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

#define DHT_PIN 4
#define DHT_TYPE DHT22

DHT dht(DHT_PIN, DHT_TYPE);
WebServer server(80);

void setup() {
  Serial.begin(115200);
  dht.begin();
  
  // Kết nối WiFi
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Connecting to WiFi...");
  }
  
  Serial.println("WiFi connected!");
  Serial.print("IP address: ");
  Serial.println(WiFi.localIP());
  
  // Định nghĩa routes
  server.on("/", handleRoot);
  server.on("/data", handleData);
  server.begin();
  
  Serial.println("Web server started");
}

void handleRoot() {
  String html = R"(
    <!DOCTYPE html>
    <html>
    <head>
      <title>Arduino Sensor Dashboard</title>
      <meta http-equiv='refresh' content='5'>
    </head>
    <body>
      <h1>Sensor Monitoring System</h1>
      <div id='data'></div>
      <script>
        fetch('/data')
          .then(response => response.json())
          .then(data => {
            document.getElementById('data').innerHTML = 
              '<p>Temperature: ' + data.temperature + '°C</p>' +
              '<p>Humidity: ' + data.humidity + '%</p>';
          });
      </script>
    </body>
    </html>
  )";
  
  server.send(200, "text/html", html);
}

void handleData() {
  float temp = dht.readTemperature();
  float hum = dht.readHumidity();
  
  String json = "{";
  json += "\"temperature\":" + String(temp) + ",";
  json += "\"humidity\":" + String(hum);
  json += "}";
  
  server.send(200, "application/json", json);
}

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

💡 Giải thích code:

• WiFi.begin(): Kết nối đến WiFi network
• WebServer server(80): Tạo web server trên port 80
• server.on("/", handleRoot): Định nghĩa route handler
• JSON response: Trả về dữ liệu dạng JSON cho API

🧩 Bài Tập Thực Hành

Hiển Thị Dữ Liệu Trên OLED

Trung bình

Sử dụng I2C để hiển thị sensor data trên OLED display

hiển_thị_dữ_liệu_trên_oled.ino

#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#include <DHT.h>

#define SCREEN_WIDTH 128
#define SCREEN_HEIGHT 64
#define OLED_RESET -1

Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);
DHT dht(2, DHT22);

void setup() {
  Serial.begin(9600);
  
  if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)) {
    Serial.println("SSD1306 allocation failed");
    return;
  }
  
  display.clearDisplay();
  display.setTextSize(1);
  display.setTextColor(SSD1306_WHITE);
  
  dht.begin();
}

void loop() {
  float temp = dht.readTemperature();
  float hum = dht.readHumidity();
  
  display.clearDisplay();
  display.setCursor(0,0);
  display.println("Sensor Monitor");
  display.println();
  display.print("Temp: ");
  display.print(temp);
  display.println(" C");
  display.print("Humidity: ");
  display.print(hum);
  display.println(" %");
  
  display.display();
  delay(2000);
}

📊 Kết quả mong đợi:

OLED hiển thị nhiệt độ và độ ẩm realtime

💡 Gợi ý:

•Wire.h cho I2C communication
•Adafruit libraries cho OLED control
•display.clearDisplay() trước khi viết mới
•display.display() để update screen

🔧 Troubleshooting:

•OLED không hiển thị: kiểm tra I2C address
•Text bị cắt: kiểm tra cursor position
•Library errors: cài đặt correct libraries
•I2C errors: kiểm tra SDA/SCL connections

IoT Dashboard với Mobile Control

Khó

Tạo web dashboard có thể điều khiển từ mobile

iot_dashboard_với_mobile_control.ino

#include <WiFi.h>
#include <AsyncTCP.h>
#include <ESPAsyncWebServer.h>

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

AsyncWebServer server(80);

int ledPin = 2;
bool ledState = false;

const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE HTML><html>
<head>
  <title>IoT Control Panel</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <style>
    body { font-family: Arial; text-align: center; margin: 0px auto; padding-top: 30px; }
    .button { background-color: #4CAF50; border: none; color: white; padding: 16px 40px;
             text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer; }
    .button2 { background-color: #555555; }
  </style>
</head>
<body>
  <h1>IoT Device Control</h1>
  <p>LED Status: <span id="state">%STATE%</span></p>
  <p><a href="/led/on"><button class="button">ON</button></a></p>
  <p><a href="/led/off"><button class="button button2">OFF</button></a></p>
</body>
</html>
)rawliteral";

void setup() {
  Serial.begin(115200);
  pinMode(ledPin, OUTPUT);
  
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Connecting...");
  }
  
  Serial.println(WiFi.localIP());
  
  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    String html = String(index_html);
    html.replace("%STATE%", ledState ? "ON" : "OFF");
    request->send(200, "text/html", html);
  });
  
  server.on("/led/on", HTTP_GET, [](AsyncWebServerRequest *request){
    ledState = true;
    digitalWrite(ledPin, HIGH);
    request->redirect("/");
  });
  
  server.on("/led/off", HTTP_GET, [](AsyncWebServerRequest *request){
    ledState = false;
    digitalWrite(ledPin, LOW);
    request->redirect("/");
  });
  
  server.begin();
}

void loop() {
  // Server runs in background
}

📊 Kết quả mong đợi:

Web interface responsive điều khiển LED từ smartphone

💡 Gợi ý:

•AsyncWebServer cho better performance
•HTML embedded trong code
•Mobile-responsive CSS design
•State management cho UI updates

🔧 Troubleshooting:

•Mobile không load: kiểm tra same WiFi network
•Buttons không work: check route definitions
•CSS lỗi: validate HTML syntax
•State không update: check replace() function

🌐 Tips IoT Integration

🔐

Security

• HTTPS cho web communication
• API keys cho cloud services
• WPA2/WPA3 cho WiFi
• Input validation cho web forms

⚡

Performance

• Async web server libraries
• JSON data minimization
• Connection pooling
• Battery optimization

📊

Monitoring

• Realtime dashboards
• Data logging và analytics
• Error tracking
• Remote debugging

← Bài trước: Làm Việc Với Cảm Biến

Tiến độ:

5/6

Bài tiếp theo: Dự Án Arduino Nâng Cao →

Vietnam Geography App

Giao Tiếp và Networking

⏱️ 120 phút🎯 Nâng cao

📡 Các Giao Thức Giao Tiếp

📡

Serial (UART)

Giao tiếp nối tiếp đơn giản, 2 dây (TX/RX)

Ứng dụng:

Debug, computer communication

Tốc độ:

9600 - 115200 baud

🔗

I2C (TWI)

Inter-Integrated Circuit, 2 dây (SDA/SCL)

Ứng dụng:

Sensors, displays, multiple devices

Tốc độ:

100kHz - 400kHz

⚡

SPI

Serial Peripheral Interface, 4 dây minimum

Ứng dụng:

High-speed devices, SD cards

Tốc độ:

Up to 10MHz+

📶

WiFi

Wireless networking với ESP32/ESP8266

Ứng dụng:

IoT, web servers, cloud connectivity

Tốc độ:

802.11 b/g/n

💻 Code Mẫu - ESP32 Web Server

esp32_web_server.ino

/*
  ESP32 Web Server với Sensor Data
  Tạo web interface để hiển thị dữ liệu sensors
*/

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

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

#define DHT_PIN 4
#define DHT_TYPE DHT22

DHT dht(DHT_PIN, DHT_TYPE);
WebServer server(80);

void setup() {
  Serial.begin(115200);
  dht.begin();
  
  // Kết nối WiFi
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Connecting to WiFi...");
  }
  
  Serial.println("WiFi connected!");
  Serial.print("IP address: ");
  Serial.println(WiFi.localIP());
  
  // Định nghĩa routes
  server.on("/", handleRoot);
  server.on("/data", handleData);
  server.begin();
  
  Serial.println("Web server started");
}

void handleRoot() {
  String html = R"(
    <!DOCTYPE html>
    <html>
    <head>
      <title>Arduino Sensor Dashboard</title>
      <meta http-equiv='refresh' content='5'>
    </head>
    <body>
      <h1>Sensor Monitoring System</h1>
      <div id='data'></div>
      <script>
        fetch('/data')
          .then(response => response.json())
          .then(data => {
            document.getElementById('data').innerHTML = 
              '<p>Temperature: ' + data.temperature + '°C</p>' +
              '<p>Humidity: ' + data.humidity + '%</p>';
          });
      </script>
    </body>
    </html>
  )";
  
  server.send(200, "text/html", html);
}

void handleData() {
  float temp = dht.readTemperature();
  float hum = dht.readHumidity();
  
  String json = "{";
  json += "\"temperature\":" + String(temp) + ",";
  json += "\"humidity\":" + String(hum);
  json += "}";
  
  server.send(200, "application/json", json);
}

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

💡 Giải thích code:

• WiFi.begin(): Kết nối đến WiFi network
• WebServer server(80): Tạo web server trên port 80
• server.on("/", handleRoot): Định nghĩa route handler
• JSON response: Trả về dữ liệu dạng JSON cho API

🧩 Bài Tập Thực Hành

Hiển Thị Dữ Liệu Trên OLED

Trung bình

Sử dụng I2C để hiển thị sensor data trên OLED display

hiển_thị_dữ_liệu_trên_oled.ino

#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#include <DHT.h>

#define SCREEN_WIDTH 128
#define SCREEN_HEIGHT 64
#define OLED_RESET -1

Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);
DHT dht(2, DHT22);

void setup() {
  Serial.begin(9600);
  
  if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)) {
    Serial.println("SSD1306 allocation failed");
    return;
  }
  
  display.clearDisplay();
  display.setTextSize(1);
  display.setTextColor(SSD1306_WHITE);
  
  dht.begin();
}

void loop() {
  float temp = dht.readTemperature();
  float hum = dht.readHumidity();
  
  display.clearDisplay();
  display.setCursor(0,0);
  display.println("Sensor Monitor");
  display.println();
  display.print("Temp: ");
  display.print(temp);
  display.println(" C");
  display.print("Humidity: ");
  display.print(hum);
  display.println(" %");
  
  display.display();
  delay(2000);
}

📊 Kết quả mong đợi:

OLED hiển thị nhiệt độ và độ ẩm realtime

💡 Gợi ý:

•Wire.h cho I2C communication
•Adafruit libraries cho OLED control
•display.clearDisplay() trước khi viết mới
•display.display() để update screen

🔧 Troubleshooting:

•OLED không hiển thị: kiểm tra I2C address
•Text bị cắt: kiểm tra cursor position
•Library errors: cài đặt correct libraries
•I2C errors: kiểm tra SDA/SCL connections

IoT Dashboard với Mobile Control

Khó

Tạo web dashboard có thể điều khiển từ mobile

iot_dashboard_với_mobile_control.ino

#include <WiFi.h>
#include <AsyncTCP.h>
#include <ESPAsyncWebServer.h>

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

AsyncWebServer server(80);

int ledPin = 2;
bool ledState = false;

const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE HTML><html>
<head>
  <title>IoT Control Panel</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <style>
    body { font-family: Arial; text-align: center; margin: 0px auto; padding-top: 30px; }
    .button { background-color: #4CAF50; border: none; color: white; padding: 16px 40px;
             text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer; }
    .button2 { background-color: #555555; }
  </style>
</head>
<body>
  <h1>IoT Device Control</h1>
  <p>LED Status: <span id="state">%STATE%</span></p>
  <p><a href="/led/on"><button class="button">ON</button></a></p>
  <p><a href="/led/off"><button class="button button2">OFF</button></a></p>
</body>
</html>
)rawliteral";

void setup() {
  Serial.begin(115200);
  pinMode(ledPin, OUTPUT);
  
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Connecting...");
  }
  
  Serial.println(WiFi.localIP());
  
  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    String html = String(index_html);
    html.replace("%STATE%", ledState ? "ON" : "OFF");
    request->send(200, "text/html", html);
  });
  
  server.on("/led/on", HTTP_GET, [](AsyncWebServerRequest *request){
    ledState = true;
    digitalWrite(ledPin, HIGH);
    request->redirect("/");
  });
  
  server.on("/led/off", HTTP_GET, [](AsyncWebServerRequest *request){
    ledState = false;
    digitalWrite(ledPin, LOW);
    request->redirect("/");
  });
  
  server.begin();
}

void loop() {
  // Server runs in background
}

📊 Kết quả mong đợi:

Web interface responsive điều khiển LED từ smartphone

💡 Gợi ý:

•AsyncWebServer cho better performance
•HTML embedded trong code
•Mobile-responsive CSS design
•State management cho UI updates

🔧 Troubleshooting:

•Mobile không load: kiểm tra same WiFi network
•Buttons không work: check route definitions
•CSS lỗi: validate HTML syntax
•State không update: check replace() function

🌐 Tips IoT Integration

🔐

Security

• HTTPS cho web communication
• API keys cho cloud services
• WPA2/WPA3 cho WiFi
• Input validation cho web forms

⚡

Performance

• Async web server libraries
• JSON data minimization
• Connection pooling
• Battery optimization

📊

Monitoring

• Realtime dashboards
• Data logging và analytics
• Error tracking
• Remote debugging