headscale-tailscale-replacement/farmq-admin/VNC_Network_Architecture_Issue.md

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 연결 방식

// 문제가 되는 현재 방식
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 변경

   // 변경 전
   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 설정 추가

# 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 변경

// 변경 전
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에 접근할 수 있도록 하는 것이 가장 현실적인 해결책입니다.