VNC WebSocket 인증 문제 해결 및 사용자 포털 계획 추가

- Proxmox VNC 티켓 생성 시 패스워드 생성 활성화
- VNC 세션에 생성된 패스워드 저장 및 전달
- noVNC 클라이언트에서 실제 패스워드 사용으로 인증 문제 해결
- ES6 모듈 방식으로 noVNC 라이브러리 로드
- HTML 엔티티 디코딩으로 WebSocket URL 문제 해결
- PharmQ 사용자 포털 서비스 계획서 추가 (KakaoTalk SSO, TossPayments)

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

farmq-admin/templates/vnc_console.html

@@ -107,17 +107,19 @@
         </div>
     </div>
 
-    <!-- CDN에서 noVNC 로드 -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/noVNC/1.3.0/core/rfb.min.js"></script>
-    
     <!-- Bootstrap Icons -->
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
 
-    <script>
-        // VNC 연결 설정
-        const websocketUrl = '{{ websocket_url }}';
+    <script type="module">
+        // noVNC 라이브러리 import
+        import RFB from 'https://cdn.jsdelivr.net/npm/@novnc/novnc/core/rfb.js';
+        
+        // VNC 연결 설정 (HTML 엔티티 디코딩)
+        const rawWebsocketUrl = '{{ websocket_url|safe }}';
+        const websocketUrl = rawWebsocketUrl.replace(/&amp;/g, '&');
         const vmName = '{{ vm_name }}';
+        const vncPassword = '{{ password }}';
         
         let rfb;
         let isConnected = false;
@@ -129,15 +131,27 @@
         // VNC 연결 시작
         function connectVNC() {
             try {
-                console.log('VNC 연결 시도:', websocketUrl);
+                console.log('Raw WebSocket URL:', rawWebsocketUrl);
+                console.log('Decoded WebSocket URL:', websocketUrl);
+                console.log('VNC Password:', vncPassword);
+                console.log('RFB 클래스 사용 가능:', !!RFB);
                 
-                // RFB 객체 생성 (간소화된 설정)
-                rfb = new RFB(canvas, websocketUrl);
+                // URL 유효성 검사
+                if (!websocketUrl || !websocketUrl.startsWith('wss://')) {
+                    throw new Error('유효하지 않은 WebSocket URL');
+                }
+                
+                // RFB 객체 생성
+                rfb = new RFB(canvas, websocketUrl, {
+                    credentials: { password: vncPassword },
+                    shared: true
+                });
                 
                 // 이벤트 리스너 등록
                 rfb.addEventListener('connect', onConnected);
                 rfb.addEventListener('disconnect', onDisconnected);
                 rfb.addEventListener('credentialsrequired', onCredentialsRequired);
+                rfb.addEventListener('securityfailure', onSecurityFailure);
                 
                 // 화면 크기 자동 조정
                 rfb.scaleViewport = true;
@@ -175,6 +189,12 @@
             showStatus('🔐 인증 필요', 'VNC 서버에서 인증이 필요합니다.', 'warning');
         }
         
+        // 보안 실패
+        function onSecurityFailure(e) {
+            console.log('VNC 보안 실패:', e.detail);
+            showStatus('🔒 보안 실패', 'VNC 보안 인증에 실패했습니다: ' + (e.detail.reason || 'Unknown'), 'danger');
+        }
+        
         // 상태 표시
         function showStatus(title, message, type = 'info') {
             statusDiv.innerHTML = `
@@ -221,15 +241,9 @@
             window.close();
         };
         
-        // 페이지 로드 후 연결 시작
-        window.addEventListener('load', function() {
-            // noVNC 라이브러리 로드 확인
-            if (typeof RFB === 'undefined') {
-                showStatus('❌ 라이브러리 오류', 'noVNC 라이브러리를 로드할 수 없습니다.', 'danger');
-                return;
-            }
-            
-            // 잠시 후 연결 시작
+        // 페이지 로드 후 연결 시작 (ES6 모듈은 즉시 사용 가능)
+        document.addEventListener('DOMContentLoaded', function() {
+            console.log('DOM 로드 완료, VNC 연결 시작...');
             setTimeout(connectVNC, 1000);
         });