Add comprehensive architecture documentation

Co-authored-by: Ospab <189454929+Ospab@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot]
2025-10-12 07:48:53 +00:00
parent 2b4116a7a1
commit 8e55c73263

291
ARCHITECTURE.md Normal file
View File

@@ -0,0 +1,291 @@
# Архитектура системы управления серверами
## Общая схема
```
┌─────────────────────────────────────────────────────────────┐
│ FRONTEND │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ ServerPanel Component │ │
│ │ ┌─────────┬─────────┬─────────┬──────────────┐ │ │
│ │ │ Обзор │ Консоль │ Статис- │ Управление │ │ │
│ │ │ │ │ тика │ │ │ │
│ │ └─────────┴─────────┴─────────┴──────────────┘ │ │
│ │ ┌─────────┬─────────┬─────────┐ │ │
│ │ │ Снэп- │ Конфигу-│ Безопас-│ │ │
│ │ │ шоты │ рация │ ность │ │ │
│ │ └─────────┴─────────┴─────────┘ │ │
│ │ │ │
│ │ Components: │ │
│ │ • ConsoleSection (noVNC) │ │
│ │ • ResizeModal (CPU/RAM/Disk) │ │
│ │ • SnapshotsSection (Create/Restore/Delete) │ │
│ │ • Stats Charts (Recharts LineChart) │ │
│ └─────────────────────────────────────────────────────┘ │
│ │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ WebSocket Hook (useSocket) │ │
│ │ • Real-time stats updates │ │
│ │ • Alert notifications │ │
│ │ • Connection status │ │
│ └─────────────────────────────────────────────────────┘ │
└──────────────────────┬──────────────────────────────────────┘
│ HTTP REST API + WebSocket
┌──────────────────────┴──────────────────────────────────────┐
│ BACKEND SERVER │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ Express.js + Socket.IO Server │ │
│ │ • CORS: localhost:3000, localhost:5173 │ │
│ │ • Port: 5000 │ │
│ └─────────────────────────────────────────────────────┘ │
│ │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ API Routes (/api/server) │ │
│ │ • GET / - List servers │ │
│ │ • GET /:id - Get server │ │
│ │ • GET /:id/status - Get stats │ │
│ │ • POST /create - Create server │ │
│ │ • POST /:id/start - Start │ │
│ │ • POST /:id/stop - Stop │ │
│ │ • POST /:id/restart - Restart │ │
│ │ • DELETE /:id - Delete │ │
│ │ • POST /:id/password - Change password │ │
│ │ • PUT /:id/resize - Resize config │ │
│ │ • POST /:id/snapshots - Create snapshot │ │
│ │ • GET /:id/snapshots - List snapshots │ │
│ │ • POST /:id/snapshots/rollback - Restore │ │
│ │ • DELETE /:id/snapshots - Delete snapshot │ │
│ │ • POST /console - Get console URL │ │
│ └─────────────────────────────────────────────────────┘ │
│ │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ MonitoringService (WebSocket) │ │
│ │ • Interval: 30 seconds │ │
│ │ • Check all active servers │ │
│ │ • Update database metrics │ │
│ │ • Broadcast to subscribed clients │ │
│ │ • Check resource limits (>90%) │ │
│ │ • Send alerts via WebSocket │ │
│ │ • Send email notifications │ │
│ └─────────────────────────────────────────────────────┘ │
│ │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ Email Service (Nodemailer) │ │
│ │ • SMTP configuration │ │
│ │ • Resource alerts │ │
│ │ • Server created notifications │ │
│ │ • Payment reminders │ │
│ └─────────────────────────────────────────────────────┘ │
│ │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ Proxmox API Integration │ │
│ │ • createLXContainer() │ │
│ │ • controlContainer() - start/stop/restart │ │
│ │ • getContainerStats() - CPU/RAM/Disk/Network │ │
│ │ • getContainerIP() │ │
│ │ • resizeContainer() - CPU/RAM/Disk │ │
│ │ • createSnapshot() │ │
│ │ • listSnapshots() │ │
│ │ • rollbackSnapshot() │ │
│ │ • deleteSnapshot() │ │
│ │ • changeRootPassword() │ │
│ │ • getConsoleURL() │ │
│ │ • deleteContainer() │ │
│ └─────────────────────────────────────────────────────┘ │
└──────────────────────┬──────────────────────────────────────┘
│ Proxmox API
│ Token: PROXMOX_TOKEN_ID + SECRET
┌──────────────────────┴──────────────────────────────────────┐
│ PROXMOX VE SERVER │
│ • LXC Containers │
│ • VNC Console Access │
│ • Resource Management │
│ • Snapshot Management │
└──────────────────────┬──────────────────────────────────────┘
┌──────────────────────┴──────────────────────────────────────┐
│ MYSQL/MARIADB DATABASE │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ Prisma Schema │ │
│ │ • User (auth, balance) │ │
│ │ • Server (status, metrics, proxmoxId) │ │
│ │ • Tariff (price, resources) │ │
│ │ • OperatingSystem (template, type) │ │
│ │ • Ticket (support system) │ │
│ │ • Check (payment verification) │ │
│ │ • Notification (user alerts) │ │
│ └─────────────────────────────────────────────────────┘ │
└──────────────────────────────────────────────────────────────┘
```
## Поток данных Real-Time мониторинга
```
┌──────────────┐ 30s interval ┌──────────────┐
│ Monitoring │ ───────────────────────>│ Proxmox │
│ Service │<───────────────────────│ VE API │
└──────┬───────┘ getContainerStats() └──────────────┘
│ Update metrics
┌──────────────┐
│ Database │
│ (Server │
│ metrics) │
└──────┬───────┘
│ Broadcast via WebSocket
┌──────────────┐ socket.emit() ┌──────────────┐
│ Socket.IO │ ───────────────────────>│ Frontend │
│ Server │ 'server-stats' │ Clients │
│ │ 'server-alerts' │ │
└──────────────┘ └──────────────┘
```
## Структура компонентов Frontend
```
ServerPanel (Main Component)
├── State Management
│ ├── server: Server | null
│ ├── stats: ServerStats | null
│ ├── activeTab: string
│ ├── showResizeModal: boolean
│ └── WebSocket hook: useServerStats(serverId)
│ ├── stats (real-time)
│ ├── alerts (real-time)
│ └── connected (status)
├── Tabs Navigation
│ ├── overview
│ ├── console
│ ├── stats
│ ├── manage
│ ├── snapshots
│ ├── resize
│ └── security
└── Tab Content
├── Overview Tab
│ └── Server info (status, tariff, OS, IP, dates)
├── Console Tab
│ └── ConsoleSection
│ ├── Open console button
│ └── Embedded iframe (noVNC)
├── Stats Tab
│ ├── WebSocket connection indicator
│ ├── Alerts display (if any)
│ ├── Stats cards (CPU, RAM, Disk)
│ ├── LineChart (history)
│ └── Detailed stats grid
├── Manage Tab
│ └── Action buttons (start, restart, stop)
├── Snapshots Tab
│ └── SnapshotsSection
│ ├── Create snapshot form
│ └── Snapshots list
│ ├── Restore button
│ └── Delete button
├── Resize Tab
│ └── Open modal button
│ └── ResizeModal (CPU, RAM, Disk inputs)
└── Security Tab
├── Generate password button
└── New password display
```
## Технологический стек
### Backend Dependencies
```
express: ^4.21.2 - HTTP сервер
socket.io: ^4.8.1 - WebSocket
@prisma/client: ^6.16.2 - ORM
axios: ^1.12.2 - HTTP клиент
nodemailer: ^6.9.16 - Email
bcrypt: ^6.0.0 - Хеширование
jsonwebtoken: ^9.0.2 - JWT
multer: ^2.0.2 - Загрузка файлов
cors: ^2.8.5 - CORS
dotenv: ^16.4.5 - Env vars
```
### Frontend Dependencies
```
react: ^19.1.1 - UI библиотека
socket.io-client: ^4.8.1 - WebSocket клиент
recharts: ^2.15.0 - Графики
axios: ^1.12.2 - HTTP клиент
react-router-dom: ^7.9.1 - Роутинг
tailwindcss: ^3.3.3 - CSS фреймворк
vite: ^7.1.2 - Build tool
typescript: ^5.8.3 - Type safety
```
## Конфигурация окружения (.env)
```env
# Database
DATABASE_URL="mysql://user:pass@localhost:3306/ospabhost"
# Proxmox
PROXMOX_API_URL="https://proxmox.example.com:8006/api2/json"
PROXMOX_TOKEN_ID="user@pam!token-id"
PROXMOX_TOKEN_SECRET="secret"
PROXMOX_NODE="proxmox"
PROXMOX_WEB_URL="https://proxmox.example.com:8006"
# Server
PORT=5000
JWT_SECRET="secret-key"
# Email (optional)
SMTP_HOST="smtp.gmail.com"
SMTP_PORT=587
SMTP_USER="email@gmail.com"
SMTP_PASS="app-password"
```
## Основные метрики производительности
- **Мониторинг интервал**: 30 секунд
- **WebSocket latency**: < 100ms
- **API response time**: < 500ms
- **Database queries**: Optimized with Prisma
- **Concurrent connections**: Поддержка множества клиентов
## Безопасность
1. **Аутентификация**: JWT tokens
2. **API доступ**: Bearer tokens
3. **Proxmox**: API tokens (не пароли)
4. **Пароли**: Bcrypt хеширование
5. **CORS**: Ограниченные origins
6. **WebSocket**: Authenticated connections
7. **SQL injection**: Prisma ORM защита
## Масштабируемость
- **Горизонтальное**: Можно запустить несколько инстансов backend
- **Database**: MySQL поддерживает репликацию
- **WebSocket**: Socket.IO поддерживает Redis adapter
- **Кэширование**: Можно добавить Redis для кэша
- **Load balancing**: Nginx/HAProxy совместимы
## Мониторинг и логирование
- Console.log для всех критических событий
- Error tracking для ошибок Proxmox API
- Database логи метрик каждые 30 секунд
- Email алерты для критических событий
- WebSocket connection/disconnection логи