2026-04-30 22:44:06 +07:00
2026-04-30 21:41:16 +07:00
2026-04-30 22:44:06 +07:00
2026-04-26 21:27:00 +07:00
2026-04-30 22:44:06 +07:00
2026-04-30 21:29:11 +07:00
2026-04-28 10:18:44 +07:00
2026-04-26 21:27:00 +07:00
2026-04-30 22:44:06 +07:00
2026-04-30 21:39:17 +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-30 21:29:11 +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 trực tiếp trong mediamtx.yml + lịch ghi hình

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/config/basic (cập nhật thông số config.json)
  • 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/mediamtx/config
  • POST /api/mediamtx/cameras (body: { "rtsp_url": "..." })
  • DELETE /api/mediamtx/cameras/{name}
  • POST /api/mediamtx/recording (ghi pathDefaults.record vào mediamtx.yml)
  • POST /api/mediamtx/restart (restart container mediamtx)
  • GET /api/recordings?camera=cam1&date=YYYY-MM-DD
  • GET /videos/<camera>/<file>.fmp4

Chạy dev (máy dev)

1) Chạy backend

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

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

Backend chỉ dùng file api/data/config.json (không đọc .env). Frontend dùng .env chỉ với VITE_DEV_BACKEND_URLVITE_API_BASE_URL.

  • mediamtx_api_url: ví dụ http://127.0.0.1:9997
  • mediamtx_webrtc_url: ví dụ http://127.0.0.1:8889
  • mediamtx_api_user: username API (nếu bật auth trong MediaMTX)
  • mediamtx_api_pass: password API (nếu bật auth trong MediaMTX)
  • recordings_dir: ví dụ ./mediamtx/recordings (cùng máy) hoặc đường dẫn mount NFS/SMB
  • api_port: cổng chạy backend (mặc định 8008)
  • cameras: danh sách camera được đồng bộ từ mediamtx.yml (name + rtsp_url)
  • schedule: lịch ghi hình

Ví dụ config.json:

{
  "mediamtx_api_url": "http://127.0.0.1:9997",
  "mediamtx_webrtc_url": "http://127.0.0.1:8889",
  "mediamtx_api_user": null,
  "mediamtx_api_pass": null,
  "recordings_dir": "/mnt/ssd/IPCam_OrangePi_Dashboard/mediamtx/recordings",
  "api_port": 8008,
  "cameras": [],
  "schedule": {
    "enabled": true,
    "weekdays_from": "18:00",
    "weekdays_to": "08:00",
    "weekend_all_day": true
  }
}

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%