ESP32 Web Flasher

ESP32 Web Flasher는 ESP32 계열 마이크로컨트롤러에 펌웨어를 플래시하는 작업을 웹 브라우저에서 수행할 수 있게 해주는 Docker 기반 웹 애플리케이션입니다. Arduino IDE, esptool.py 등 별도 소프트웨어 설치 없이 Chrome/Edge 브라우저와 USB 케이블만으로 동작합니다.

지원 칩 패밀리

두 개의 Docker 컨테이너가 Docker Compose로 오케스트레이션됩니다. Nginx가 리버스 프록시 역할을 하여 정적 파일 서빙과 API 라우팅을 모두 담당합니다.

통신 흐름

Nginx 라우팅 규칙

location /api/      →  proxy_pass http://backend:3000/api/
location /firmware/ →  proxy_pass http://backend:3000/firmware/
location /          →  try_files $uri /index.html  (SPA 라우팅)

백엔드는 외부에 포트를 노출하지 않으며, Docker 내부 DNS(backend:3000)를 통해서만 접근됩니다.

인프라

① 펌웨어 업로드 관리

multipart/form-data 방식으로 최대 3개의 .bin 파일(firmware, bootloader, partitions)을 동시 업로드합니다. 각 파일은 타임스탬프-랜덤4바이트.bin 형태로 저장되고, UUID 기반 메타데이터가 JSON 파일에 기록됩니다.

{
  "id": "550e8400-e29b-41d4-a716-446655440000",
  "name": "My Product v1.0",
  "version": "1.0.0",
  "chipFamily": "ESP32-S3",
  "createdAt": "2025-05-17T10:00:00.000Z",
  "parts": [
    { "file": "1747123456-ab12.bin", "offset": "0x0000",  "label": "Bootloader" },
    { "file": "1747123456-cd34.bin", "offset": "0x8000",  "label": "Partition Table" },
    { "file": "1747123456-ef56.bin", "offset": "0x10000", "label": "Application" }
  ]
}

② Manifest 동적 생성

백엔드가 저장된 메타데이터를 esp-web-tools 표준 manifest 형식으로 변환합니다. offset은 16진수 문자열에서 정수로 자동 변환됩니다.

GET /api/firmware/:id/manifest

{
  "name": "My Product v1.0",
  "version": "1.0.0",
  "new_install_prompt_erase": true,
  "builds": [{
    "chipFamily": "ESP32-S3",
    "parts": [
      { "path": "/firmware/files/xxxx.bin", "offset": 0 },
      { "path": "/firmware/files/yyyy.bin", "offset": 32768 },
      { "path": "/firmware/files/zzzz.bin", "offset": 65536 }
    ]
  }]
}

③ Web Serial API 연결 확인

플래시 전에 ESP32가 올바르게 연결되었는지 VID/PID로 확인합니다. Espressif의 USB Vendor ID는 0x303A로, 이 값을 감지하면 ESP32 장치로 판단합니다.

④ 드래그&드롭 파일 업로드

DataTransfer API를 이용한 드래그&드롭 인터페이스와 XHR 기반 업로드 진행률 추적을 구현합니다. fetch()는 업로드 진행률을 지원하지 않으므로 XMLHttpRequest를 직접 사용합니다.

⑤ 시리얼 모니터

업로드 필드 상세

펌웨어 업로드 흐름

플래싱 흐름

플래싱 단계에서 .bin 파일은 서버에서 브라우저로 다운로드된 후, 브라우저가 직접 Web Serial API를 통해 ESP32에 씁니다. 서버는 플래시 과정에 관여하지 않으므로 네트워크 지연의 영향이 최소화됩니다.

현재 구현된 보안 조치

ESP32 하드웨어 보안 옵션

추천 보안 강화 방향

# HTTPS (Nginx SSL 설정 예시)
server {
    listen 443 ssl;
    ssl_certificate     /etc/ssl/cert.pem;
    ssl_certificate_key /etc/ssl/key.pem;
    ...
}

# Flash Encryption 활성화 (esptool)
espefuse.py --chip esp32s3 burn_efuse DIS_DOWNLOAD_PLAIN_DECRYPT

Docker 구성 상세

환경 변수

운영 명령

# 빌드 및 시작
docker compose up -d --build

# 로그 확인
docker compose logs -f

# 재시작
docker compose restart

# 중지 (데이터 유지)
docker compose down

# 완전 초기화 (데이터 삭제)
docker compose down -v

현재 구현 평가

확장 로드맵

상업화 가능성

Espressif 공식 esp-web-tools를 기반으로 하므로 기술 안정성이 높습니다. ESP32-S3의 내장 USB-OTG 지원으로 별도 USB-UART 변환 칩 없이 플래싱이 가능하고, 이는 제품 원가 절감으로 이어집니다. MAC 주소 기반 라이선스 바인딩(ESP32의 eFuse MAC은 위변조 난이도 높음)과 결합하면 펌웨어 유료 판매 플랫폼으로 확장할 수 있습니다.

현재 MVP 아키텍처(파일 기반 JSON 메타데이터)는 소규모 운영에 적합하며, 수백~수천 건 이상의 트래픽이 예상되면 PostgreSQL 등 관계형 DB와 S3 호환 스토리지로 마이그레이션이 권장됩니다.