VNC 인증 실패 자동 해결 시스템 구현

- VNC 티켓 만료 시 자동 새로고침 API 엔드포인트 추가 (/api/vnc/refresh/<session_id>)
- credentialsrequired 및 securityfailure 이벤트 시 자동 티켓 새로고침 로직 구현
- 새 티켓으로 자동 재연결 기능 추가 (기존 연결 종료 후 새 연결 생성)
- 수동 새로고침 버튼 추가 (🔄 Refresh 버튼)
- 인증 실패 발생 시 사용자에게 진행 상황 표시
- VNC 세션 데이터 자동 업데이트 및 타임스탬프 추가

이제 "Authentication failed" 오류 시 자동으로 새 VNC 티켓을 받아와서 재연결되어
사용자가 수동으로 새로고침할 필요가 없음

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
시골약사 2025-09-11 23:49:41 +09:00
parent 0dda1423f8
commit 1dc09101cc
2 changed files with 135 additions and 2 deletions

View File

@ -566,6 +566,55 @@ def create_app(config_name=None):
print(f"❌ VNC API 오류: {e}")
return jsonify({'error': str(e)}), 500
@app.route('/api/vnc/refresh/<session_id>', methods=['POST'])
def api_vnc_refresh_ticket(session_id):
"""VNC 티켓 새로고침 API"""
try:
# 세션 확인
if session_id not in vnc_sessions:
return jsonify({'error': '유효하지 않은 VNC 세션입니다.'}), 404
session_data = vnc_sessions[session_id]
node = session_data['node']
vmid = session_data['vmid']
print(f"🔄 VNC 티켓 새로고침 요청: {node}/{vmid}")
# Proxmox 클라이언트 생성
client = ProxmoxClient(
host=config['proxmox']['host'],
username=config['proxmox']['username'],
password=config['proxmox']['password']
)
if not client.login():
return jsonify({'error': 'Proxmox 로그인 실패'}), 500
# 새 VNC 티켓 생성
vnc_data = client.get_vnc_ticket(node, vmid)
if not vnc_data:
return jsonify({'error': '새 VNC 티켓 생성 실패'}), 500
# 세션 업데이트
vnc_sessions[session_id].update({
'websocket_url': vnc_data['websocket_url'],
'password': vnc_data.get('password', ''),
'updated_at': datetime.now()
})
print(f"✅ VNC 티켓 새로고침 완료: {session_id}")
return jsonify({
'success': True,
'websocket_url': vnc_data['websocket_url'],
'password': vnc_data.get('password', ''),
'message': '새 VNC 티켓이 생성되었습니다.'
})
except Exception as e:
print(f"❌ VNC 티켓 새로고침 실패: {e}")
return jsonify({'error': str(e)}), 500
@app.route('/vnc/<session_id>')
def vnc_console(session_id):
"""VNC 콘솔 페이지"""

View File

@ -28,12 +28,22 @@
text-align: center;
}
#sendCtrlAltDelButton {
position: fixed;
top: 0px;
right: 120px;
border: 1px outset;
padding: 5px 5px 4px 5px;
cursor: pointer;
}
#refreshTicketButton {
position: fixed;
top: 0px;
right: 0px;
border: 1px outset;
padding: 5px 5px 4px 5px;
cursor: pointer;
background-color: #5bc0de;
}
#screen {
@ -74,8 +84,77 @@
// When this function is called, the server requires
// credentials to authenticate
function credentialsAreRequired(e) {
const password = prompt("Password Required:");
rfb.sendCredentials({ password: password });
console.log('VNC 인증 정보가 필요합니다. 티켓을 새로고침합니다...');
refreshVNCTicket();
}
// VNC 보안 실패 시 티켓 새로고침
function onSecurityFailure(e) {
console.log('VNC 보안 인증 실패:', e.detail);
status("Authentication failed - refreshing ticket...");
refreshVNCTicket();
}
// VNC 티켓 새로고침
function refreshVNCTicket() {
const sessionId = window.location.pathname.split('/').pop();
fetch(`/api/vnc/refresh/${sessionId}`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
}
})
.then(response => response.json())
.then(data => {
if (data.success) {
console.log('✅ 새 VNC 티켓 받음, 재연결 시도...');
status("Got new ticket - reconnecting...");
// 기존 연결 종료
if (rfb) {
rfb.disconnect();
}
// 잠시 후 새 티켓으로 재연결
setTimeout(() => {
connectWithNewTicket(data.websocket_url, data.password);
}, 1000);
} else {
status("Failed to refresh ticket: " + (data.error || 'Unknown error'));
}
})
.catch(error => {
console.error('티켓 새로고침 실패:', error);
status("Failed to refresh ticket");
});
}
// 새 티켓으로 재연결
function connectWithNewTicket(newWebsocketUrl, newPassword) {
console.log('새 티켓으로 VNC 재연결 시도...');
status("Reconnecting with new ticket...");
const decodedUrl = decodeHtmlEntities(newWebsocketUrl);
const decodedPassword = decodeHtmlEntities(newPassword);
console.log('새 WebSocket URL:', decodedUrl);
console.log('새 VNC Password:', decodedPassword);
// 새 RFB 연결 생성
rfb = new RFB(document.getElementById('screen'), decodedUrl,
{ credentials: { password: decodedPassword } });
// 이벤트 리스너 재등록
rfb.addEventListener("connect", connectedToServer);
rfb.addEventListener("disconnect", disconnectedFromServer);
rfb.addEventListener("credentialsrequired", credentialsAreRequired);
rfb.addEventListener("desktopname", updateDesktopName);
rfb.addEventListener("securityfailure", onSecurityFailure);
// 설정 적용
rfb.viewOnly = false;
rfb.scaleViewport = true;
}
// When this function is called we have received
@ -98,6 +177,9 @@
}
document.getElementById('sendCtrlAltDelButton').onclick = sendCtrlAltDel;
document.getElementById('refreshTicketButton').onclick = function() {
refreshVNCTicket();
};
// VNC 연결 정보 (서버에서 전달)
const rawWebsocketUrl = '{{ websocket_url|safe }}';
@ -119,6 +201,7 @@
rfb.addEventListener("disconnect", disconnectedFromServer);
rfb.addEventListener("credentialsrequired", credentialsAreRequired);
rfb.addEventListener("desktopname", updateDesktopName);
rfb.addEventListener("securityfailure", onSecurityFailure);
// Set parameters that can be changed on an active connection
rfb.viewOnly = false;
@ -130,6 +213,7 @@
<div id="top_bar">
<div id="status">Loading</div>
<div id="sendCtrlAltDelButton">Send CtrlAltDel</div>
<div id="refreshTicketButton">🔄 Refresh</div>
</div>
<div id="screen">
<!-- This is where the remote screen will appear -->