2026-04-28 10:18:44 +07:00
2026-04-26 21:27:00 +07:00
2026-04-28 10:18:44 +07:00
2026-04-26 21:27:00 +07:00
2026-04-28 10:18:44 +07:00
2026-04-28 10:18:44 +07:00
2026-04-26 21:27:00 +07:00
2026-04-26 21:27:00 +07:00
2026-04-28 10:18:44 +07:00
2026-04-27 22:13:43 +07:00
2026-04-26 21:27:00 +07:00
2026-04-26 21:27:00 +07:00
2026-04-27 22:13:43 +07:00
2026-04-26 21:27:00 +07:00
2026-04-26 21:27:00 +07:00
2026-04-26 21:27:00 +07:00
2026-04-28 10:18:44 +07:00
2026-04-26 21:27:00 +07:00
2026-04-26 21:27:00 +07:00
2026-04-27 22:13:43 +07:00

IPCam Orange Pi Dashboard

Dashboard giám sát camera IP gọn nhẹ chạy trên Orange Pi, dựa trên MediaMTX:

  • Live View (WebRTC WHEP) dạng grid, auto reconnect, lazy load
  • Playback fMP4 theo camera + ngày (file list + HTML5 video)
  • Settings: quản lý camera + lịch ghi hình (scheduler ở backend)

Cấu trúc thư mục

  • src/: frontend React
  • api/: backend FastAPI
  • .trae/documents/: tài liệu yêu cầu/kiến trúc

Backend API

  • GET /api/health
  • GET /api/config
  • POST /api/cameras / DELETE /api/cameras/{name}
  • GET /api/paths (proxy trạng thái từ MediaMTX)
  • POST /api/recording (bật/tắt ghi hình ngay)
  • POST /api/scheduler/enabled / POST /api/scheduler/schedule
  • GET /api/recordings?camera=cam1&date=YYYY-MM-DD
  • GET /videos/<camera>/<file>.fmp4

Chạy dev (máy dev)

0) Tạo file .env

cp .env.example .env

Sửa các biến trong .env theo IP/port thực tế (MediaMTX, recordings, CORS).

1) Chạy backend

python3 -m venv api/.venv
source api/.venv/bin/activate
pip install -r api/requirements.txt
python3 api/run.py

2) Chạy frontend

npm install
npm run dev

Frontend dev server đã được cấu hình proxy /api/videos sang http://localhost:8008.

Cấu hình

Khuyến nghị cấu hình bằng file .env (copy từ .env.example).

Backend tự tạo file cấu hình tại api/data/config.json khi chạy lần đầu.

  • mediamtx_api_url: ví dụ http://127.0.0.1:9997
  • mediamtx_webrtc_url: ví dụ http://127.0.0.1:8889
  • recordings_dir: ví dụ /recordings
  • cameras: danh sách camera (name + rtsp_url)
  • schedule: lịch ghi hình

Có thể override WebRTC base URL ở frontend bằng biến môi trường VITE_MEDIAMTX_WEBRTC_URL.

Có thể set giá trị mặc định khi chạy lần đầu bằng ENV (backend):

  • MEDIAMTX_API_URL (ví dụ http://192.168.88.10:9997)
  • MEDIAMTX_WEBRTC_URL (ví dụ http://192.168.88.10:8889)
  • RECORDINGS_DIR (ví dụ /recordings hoặc đường dẫn mount NFS/SMB)

Chạy tách 2 thiết bị (cùng LAN)

  • Máy A (MediaMTX + ổ lưu recordings): chạy MediaMTX, mở cổng 9997/tcp, 8889/tcp, 8189/udp, 8554/tcp
  • Máy B (Dashboard backend + frontend): chạy FastAPI + serve web UI
  • Playback: máy B cần đọc được thư mục recordings của máy A (khuyến nghị mount NFS/SMB về RECORDINGS_DIR)

Chi tiết xem INSTALL.md.

Triển khai

Xem hướng dẫn chi tiết trong INSTALL.md.

S
Description
Phần mềm ghi và xem camera sử dụng Orange Pi làm máy chủ, hoàn toàn local
Readme 4.5 MiB
Languages
TypeScript 65.3%
Python 29.9%
CSS 2.1%
JavaScript 1.5%
HTML 0.8%
Other 0.4%