- Added support for multiple Proxmox hosts (pve7.0bin.in:443, Healthport PVE:8006) - Enhanced VM management APIs to accept host parameter - Fixed WebSocket URL generation bug (dynamic port handling) - Added comprehensive SSL certificate trust help system - Implemented host selection dropdown in UI - Added VNC connection failure detection and automatic SSL help redirection - Updated session management to store host_key information - Enhanced error handling for different Proxmox configurations 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
161 lines
4.5 KiB
Markdown
161 lines
4.5 KiB
Markdown
# VNC 네트워크 아키텍처 문제 분석 및 해결방안
|
|
|
|
## 🔍 현재 상황 분석
|
|
|
|
### 네트워크 구조
|
|
```
|
|
[외부 사용자 PC]
|
|
↓ (인터넷)
|
|
[pqadmin.0bin.in] (Let's Encrypt SSL + 리버스 프록시)
|
|
↓ (로컬/VPN)
|
|
[Headscale 서버 - Flask Admin]
|
|
↓ (Headscale VPN: 100.64.x.x)
|
|
[Proxmox Hosts]
|
|
- pve7.0bin.in (443)
|
|
- 100.64.0.6:8006 (Healthport PVE)
|
|
```
|
|
|
|
### 문제 상황
|
|
1. **Flask 서버**: Headscale VPN 내부에서 실행 중
|
|
2. **외부 사용자**: `pqadmin.0bin.in`을 통해 Flask Admin에 접속
|
|
3. **VNC WebSocket URL**: `wss://100.64.0.6:8006/...` (Headscale VPN 내부 IP)
|
|
4. **접속 실패**: 외부 사용자는 100.64.x.x 대역에 접근 불가
|
|
|
|
## ❌ 핵심 문제
|
|
|
|
### 네트워크 분리 문제
|
|
- **Flask Admin**: 인터넷에서 접근 가능 (`pqadmin.0bin.in`)
|
|
- **Proxmox VNC**: Headscale VPN 내부에서만 접근 가능 (`100.64.x.x`)
|
|
- **사용자**: 두 네트워크를 동시에 접근할 수 없음
|
|
|
|
### 현재 WebSocket 연결 방식
|
|
```javascript
|
|
// 문제가 되는 현재 방식
|
|
WebSocket URL: wss://100.64.0.6:8006/api2/json/nodes/pev/qemu/103/vncwebsocket
|
|
```
|
|
|
|
## 💡 해결방안
|
|
|
|
### 1. WebSocket 프록시 구현 (권장)
|
|
|
|
#### 구조
|
|
```
|
|
[외부 사용자] → [pqadmin.0bin.in] → [Flask 서버] → [Proxmox VNC]
|
|
↓ ↓ ↓ ↓
|
|
wss://pqadmin.0bin.in/vnc-proxy/{session_id} → wss://100.64.0.6:8006/...
|
|
```
|
|
|
|
#### 구현 방법
|
|
1. **Flask에서 WebSocket 프록시 서버 구현**
|
|
- Socket.IO 또는 웹소켓 라이브러리 사용
|
|
- 외부 → Flask → Proxmox 중계 역할
|
|
|
|
2. **URL 변경**
|
|
```javascript
|
|
// 변경 전
|
|
wss://100.64.0.6:8006/api2/json/nodes/pev/qemu/103/vncwebsocket
|
|
|
|
// 변경 후
|
|
wss://pqadmin.0bin.in/vnc-proxy/session_id_here
|
|
```
|
|
|
|
### 2. Nginx 리버스 프록시 확장
|
|
|
|
#### Nginx 설정 추가
|
|
```nginx
|
|
# VNC WebSocket 프록시
|
|
location /vnc-ws/ {
|
|
proxy_pass https://100.64.0.6:8006/;
|
|
proxy_http_version 1.1;
|
|
proxy_set_header Upgrade $http_upgrade;
|
|
proxy_set_header Connection "upgrade";
|
|
proxy_set_header Host $host;
|
|
proxy_set_header X-Real-IP $remote_addr;
|
|
proxy_ssl_verify off;
|
|
}
|
|
```
|
|
|
|
#### URL 변경
|
|
```javascript
|
|
// 변경 전
|
|
wss://100.64.0.6:8006/api2/json/nodes/pev/qemu/103/vncwebsocket
|
|
|
|
// 변경 후
|
|
wss://pqadmin.0bin.in/vnc-ws/api2/json/nodes/pev/qemu/103/vncwebsocket
|
|
```
|
|
|
|
### 3. VPN 클라이언트 요구 (비권장)
|
|
|
|
#### 방법
|
|
- 모든 사용자가 Headscale VPN 클라이언트 설치
|
|
- 100.64.x.x 대역 직접 접근 가능
|
|
|
|
#### 단점
|
|
- 사용자 부담 증가
|
|
- 관리 복잡성
|
|
- 보안 위험
|
|
|
|
## 🎯 권장 솔루션: WebSocket 프록시
|
|
|
|
### 장점
|
|
1. **사용자 친화적**: 별도 설치 없이 웹브라우저로 접근
|
|
2. **보안**: Headscale VPN은 내부 트래픽만 처리
|
|
3. **확장성**: 다수의 Proxmox 호스트 지원
|
|
4. **SSL 인증서**: Let's Encrypt로 안전한 연결
|
|
|
|
### 구현 우선순위
|
|
1. **1단계**: Flask Socket.IO WebSocket 프록시 구현
|
|
2. **2단계**: 세션 관리 및 인증 강화
|
|
3. **3단계**: 다중 Proxmox 호스트 지원 완성
|
|
4. **4단계**: 성능 최적화 및 모니터링
|
|
|
|
## 🔧 기술 스택
|
|
|
|
### 현재 사용 중
|
|
- **Flask**: Web 서버
|
|
- **noVNC**: 브라우저 VNC 클라이언트
|
|
- **Headscale**: VPN 서버
|
|
- **Nginx**: 리버스 프록시
|
|
- **Let's Encrypt**: SSL 인증서
|
|
|
|
### 추가 필요
|
|
- **Flask-SocketIO**: WebSocket 프록시 구현
|
|
- **python-websockets**: WebSocket 클라이언트 (Proxmox 연결용)
|
|
|
|
## 📋 구현 단계
|
|
|
|
### Phase 1: WebSocket 프록시 서버
|
|
1. Flask-SocketIO 설치 및 설정
|
|
2. VNC WebSocket 프록시 핸들러 구현
|
|
3. 세션 관리 및 인증 연동
|
|
|
|
### Phase 2: URL 라우팅 변경
|
|
1. VNC 연결 URL 생성 로직 수정
|
|
2. 프록시 경로로 WebSocket URL 변경
|
|
3. noVNC 클라이언트 연결 테스트
|
|
|
|
### Phase 3: 다중 호스트 지원
|
|
1. 호스트별 프록시 라우팅
|
|
2. 동적 Proxmox 호스트 추가
|
|
3. 로드 밸런싱 고려
|
|
|
|
## ⚠️ 고려사항
|
|
|
|
### 성능
|
|
- WebSocket 프록시로 인한 지연 시간 증가
|
|
- 동시 연결 수 제한
|
|
- 서버 리소스 사용량 증가
|
|
|
|
### 보안
|
|
- VNC 트래픽 암호화 상태 유지
|
|
- 세션 만료 및 권한 관리
|
|
- DDoS 방어 메커니즘
|
|
|
|
### 확장성
|
|
- 다수 사용자 동시 접속
|
|
- Proxmox 호스트 동적 추가
|
|
- 클러스터 환경 지원
|
|
|
|
---
|
|
|
|
**결론**: WebSocket 프록시를 통해 외부 사용자가 안전하게 내부 Proxmox VNC에 접근할 수 있도록 하는 것이 가장 현실적인 해결책입니다. |