Phần 3: Thiết lập máy chủ web cho camera streaming

1. Giới thiệu về máy chủ web và cách hoạt động của nó

Máy chủ web là một phần mềm hoặc phần cứng phục vụ cho việc lưu trữ, xử lý và cung cấp dữ liệu cho các yêu cầu từ trình duyệt web. Khi người dùng truy cập vào một địa chỉ URL, trình duyệt sẽ gửi yêu cầu tới máy chủ web, và máy chủ sẽ trả về nội dung tương ứng, thường là các trang HTML.

Trong dự án này, chúng ta sẽ thiết lập một máy chủ web trên ESP32-CAM để phát video từ camera qua WiFi. Điều này có nghĩa là khi bạn truy cập vào địa chỉ IP của ESP32-CAM từ trình duyệt, bạn sẽ nhận được luồng video trực tiếp từ camera.

2. Viết code tạo máy chủ web trong ESP32-CAM

Để tạo máy chủ web trên ESP32-CAM, chúng ta cần sử dụng thư viện WebServer có sẵn trong Arduino IDE. Dưới đây là mã nguồn mẫu để thiết lập máy chủ web:


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

const char* ssid = "YOUR_SSID"; // Thay YOUR_SSID bằng tên WiFi của bạn
const char* password = "YOUR_PASSWORD"; // Thay YOUR_PASSWORD bằng mật khẩu WiFi của bạn

WebServer server(80);

void startCameraServer() {
  server.on("/", HTTP_GET, []() {
    server.send(200, "text/html", "<h1>Camera Streaming</h1><img src='stream' />");
  });

  server.on("/stream", HTTP_GET, []() {
    // Bắt đầu luồng video
    server.sendHeader("Access-Control-Allow-Origin", "*");
    server.send(200, "multipart/x-mixed-replace; boundary=frame");
    while (true) {
      camera_fb_t *fb = esp_camera_fb_get();
      if (!fb) {
        Serial.println("Không thể lấy khung hình");
        return;
      }
      server.sendContent("--frame\r\n");
      server.sendContent("Content-Type: image/jpeg\r\n");
      server.sendContent("Content-Length: ");
      server.sendContent(String(fb->len) + "\r\n\r\n");
      server.sendContent((const char*)fb->buf, fb->len);
      server.sendContent("\r\n");
      esp_camera_fb_return(fb);
      if (!server.client().connected()) {
        break;
      }
    }
  });

  server.begin();
  Serial.println("Máy chủ web đã bắt đầu");
}

void setup() {
  Serial.begin(115200);
  camera_config_t config;
  // Cấu hình camera
  // ... (cấu hình camera ở đây)

  esp_camera_init(&config);
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Đang kết nối đến WiFi...");
  }
  Serial.println("Đã kết nối WiFi");
  Serial.print("Địa chỉ IP: ");
  Serial.println(WiFi.localIP());
  startCameraServer();
}

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

3. Cách streaming video từ camera qua máy chủ web

Sau khi đã thiết lập máy chủ web, chúng ta cần đảm bảo rằng camera có thể lấy khung hình và gửi chúng tới máy chủ. Trong phần mã nguồn trên, chúng ta đã định nghĩa một endpoint "/stream" để phục vụ luồng video. Khi người dùng truy cập vào endpoint này, máy chủ sẽ trả về các khung hình video liên tiếp.

Để bắt đầu streaming, bạn chỉ cần truy cập vào địa chỉ IP của ESP32-CAM trong trình duyệt và thêm "/stream" vào cuối địa chỉ. Ví dụ: http://192.168.1.100/stream

4. Kiểm tra hoạt động của máy chủ web trên trình duyệt

Để kiểm tra hoạt động của máy chủ web, bạn cần thực hiện các bước sau:

Kết nối ESP32-CAM với nguồn điện và tải mã nguồn lên.
Mở Serial Monitor trong Arduino IDE để xem địa chỉ IP của ESP32-CAM.
Mở trình duyệt web và nhập địa chỉ IP của ESP32-CAM kèm theo "/stream".

Nếu tất cả hoạt động tốt, bạn sẽ thấy luồng video từ camera xuất hiện trên trình duyệt của mình.

5. Giải thích các phần mã nguồn quan trọng

Dưới đây là một số phần mã nguồn quan trọng trong đoạn mã trên:

WiFi.begin(ssid, password); - Dòng lệnh này sẽ kết nối ESP32-CAM với mạng WiFi đã chỉ định.
server.on("/", HTTP_GET, ...); - Đoạn mã này xác định hành vi của máy chủ khi nhận được yêu cầu từ đường dẫn gốc "/". Nó sẽ trả về một trang HTML đơn giản với một thẻ <img> để hiển thị luồng video.
esp_camera_fb_get(); - Hàm này lấy khung hình từ camera. Nếu không thành công, nó sẽ in ra thông báo lỗi.
server.sendContent(); - Dùng để gửi dữ liệu hình ảnh tới trình duyệt, bao gồm cả khung hình và kích thước của nó.

Tip: Đảm bảo rằng bạn đã cài đặt thư viện camera cho ESP32 và đã cấu hình đúng các thông số camera trước khi chạy chương trình.

Với các bước trên, bạn đã hoàn thành việc thiết lập máy chủ web cho camera streaming trên ESP32-CAM. Hãy thử nghiệm và tạo ra những ứng dụng thú vị từ dự án này!

ESP32-CAM – Camera Streaming