feat: SSO 쿠키 인증 통합 + 서브도메인 라우팅 아키텍처

- Path-based 라우팅을 서브도메인 기반으로 전환
  (tkfb/tkreport/tkqc.technicalkorea.net)
- 3개 시스템 프론트엔드에 SSO 쿠키 인증 통합
  (domain=.technicalkorea.net, localStorage 폴백)
- Gateway: 포털+로그인+System1 프록시, 쿠키 SSO 설정
- System 1: 토큰키 통일, nginx.conf 생성, 신고페이지 리다이렉트
- System 2: api-base.js/app-init.js 생성, getSSOToken() 통합
- System 3: TokenManager 쿠키 지원, 중앙 로그인 리다이렉트
- docker-compose.yml에 cloudflared 서비스 추가
- DEPLOY-GUIDE.md 배포 가이드 작성

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

system3-nonconformance/web/static/js/api.js

@@ -1,43 +1,80 @@
-// API 기본 설정 (Cloudflare 터널 + 로컬 환경 지원)
+// SSO 쿠키 헬퍼
+function _cookieGet(name) {
+    const match = document.cookie.match(new RegExp('(?:^|; )' + name + '=([^;]*)'));
+    return match ? decodeURIComponent(match[1]) : null;
+}
+function _cookieRemove(name) {
+    let cookie = name + '=; path=/; max-age=0';
+    if (window.location.hostname.includes('technicalkorea.net')) {
+        cookie += '; domain=.technicalkorea.net';
+    }
+    document.cookie = cookie;
+}
+
+// 중앙 로그인 URL
+function _getLoginUrl() {
+    const hostname = window.location.hostname;
+    if (hostname.includes('technicalkorea.net')) {
+        return window.location.protocol + '//tkfb.technicalkorea.net/login?redirect=' + encodeURIComponent(window.location.href);
+    }
+    return window.location.protocol + '//' + hostname + ':30000/login?redirect=' + encodeURIComponent(window.location.href);
+}
+
+// API 기본 설정 (통합 환경 지원)
 const API_BASE_URL = (() => {
     const hostname = window.location.hostname;
     const protocol = window.location.protocol;
     const port = window.location.port;
-    
-    console.log('🔧 API URL 생성 - hostname:', hostname, 'protocol:', protocol, 'port:', port);
-    
-    // 로컬 환경 (포트 있음)
+
+    // 프로덕션 (technicalkorea.net) - 같은 도메인 /api
+    if (hostname.includes('technicalkorea.net')) {
+        return protocol + '//' + hostname + '/api';
+    }
+
+    // 통합 개발 환경 (포트 30280)
+    if (port === '30280' || port === '30000') {
+        return protocol + '//' + hostname + ':30200/api';
+    }
+
+    // 기존 TKQC 로컬 환경 (포트 16080)
     if (port === '16080') {
-        const url = `${protocol}//${hostname}:${port}/api`;
-        console.log('🏠 로컬 환경 URL:', url);
-        return url;
+        return protocol + '//' + hostname + ':16080/api';
     }
-    
-    // Cloudflare 터널 환경 (m.hyungi.net) - 강제 HTTPS
-    if (hostname === 'm.hyungi.net') {
-        const url = `https://m-api.hyungi.net/api`;
-        console.log('☁️ Cloudflare 환경 URL:', url);
-        return url;
-    }
-    
+
     // 기타 환경
-    const url = '/api';
-    console.log('🌐 기타 환경 URL:', url);
-    return url;
+    return '/api';
 })();
 
-// 토큰 관리
+// 토큰 관리 (SSO 쿠키 + localStorage 이중 지원)
 const TokenManager = {
-    getToken: () => localStorage.getItem('access_token'),
+    getToken: () => {
+        // SSO 쿠키 우선 (sso_token), localStorage 폴백 (access_token)
+        return _cookieGet('sso_token') || localStorage.getItem('sso_token') || localStorage.getItem('access_token');
+    },
     setToken: (token) => localStorage.setItem('access_token', token),
-    removeToken: () => localStorage.removeItem('access_token'),
-    
+    removeToken: () => {
+        _cookieRemove('sso_token');
+        _cookieRemove('sso_user');
+        _cookieRemove('sso_refresh_token');
+        localStorage.removeItem('access_token');
+        localStorage.removeItem('sso_token');
+        localStorage.removeItem('sso_user');
+    },
+
     getUser: () => {
-        const userStr = localStorage.getItem('current_user');
+        // SSO 쿠키 우선, localStorage 폴백
+        const ssoUser = _cookieGet('sso_user') || localStorage.getItem('sso_user');
+        if (ssoUser) {
+            try { return JSON.parse(ssoUser); } catch(e) {}
+        }
+        const userStr = localStorage.getItem('currentUser') || localStorage.getItem('current_user');
         return userStr ? JSON.parse(userStr) : null;
     },
     setUser: (user) => localStorage.setItem('current_user', JSON.stringify(user)),
-    removeUser: () => localStorage.removeItem('current_user')
+    removeUser: () => {
+        localStorage.removeItem('current_user');
+        localStorage.removeItem('currentUser');
+    }
 };
 
 // API 요청 헬퍼
@@ -64,10 +101,10 @@ async function apiRequest(endpoint, options = {}) {
         const response = await fetch(`${API_BASE_URL}${endpoint}`, config);
         
         if (response.status === 401) {
-            // 인증 실패 시 로그인 페이지로
+            // 인증 실패 시 중앙 로그인 페이지로
             TokenManager.removeToken();
             TokenManager.removeUser();
-            window.location.href = '/index.html';
+            window.location.href = _getLoginUrl();
             return;
         }
         
@@ -129,7 +166,7 @@ const AuthAPI = {
     logout: () => {
         TokenManager.removeToken();
         TokenManager.removeUser();
-        window.location.href = '/index.html';
+        window.location.href = _getLoginUrl();
     },
     
     getMe: () => apiRequest('/auth/me'),
@@ -287,7 +324,7 @@ const ReportsAPI = {
 function checkAuth() {
     const user = TokenManager.getUser();
     if (!user) {
-        window.location.href = '/index.html';
+        window.location.href = _getLoginUrl();
         return null;
     }
     return user;
@@ -297,27 +334,27 @@ function checkAdminAuth() {
     const user = checkAuth();
     if (user && user.role !== 'admin') {
         alert('관리자 권한이 필요합니다.');
-        window.location.href = '/index.html';
+        window.location.href = _getLoginUrl();
         return null;
     }
     return user;
 }
 
-// 페이지 접근 권한 체크 함수 (새로 추가)
+// 페이지 접근 권한 체크 함수
 function checkPageAccess(pageName) {
     const user = checkAuth();
     if (!user) return null;
-    
+
     // admin은 모든 페이지 접근 가능
     if (user.role === 'admin') return user;
-    
+
     // 페이지별 권한 체크는 pagePermissionManager에서 처리
     if (window.pagePermissionManager && !window.pagePermissionManager.canAccessPage(pageName)) {
         alert('이 페이지에 접근할 권한이 없습니다.');
-        window.location.href = '/index.html';
+        window.location.href = _getLoginUrl();
         return null;
     }
-    
+
     return user;
 }
 

system3-nonconformance/web/static/js/app.js

@@ -46,12 +46,17 @@ class App {
      * 인증 확인
      */
     async checkAuth() {
-        const token = localStorage.getItem('access_token');
+        // SSO 쿠키 우선, localStorage 폴백
+        const token = this._cookieGet('sso_token') || localStorage.getItem('sso_token') || localStorage.getItem('access_token');
         if (!token) {
             throw new Error('토큰 없음');
         }
 
-        // 임시로 localStorage에서 사용자 정보 가져오기
+        // SSO 쿠키에서 사용자 정보 시도
+        const ssoUser = this._cookieGet('sso_user') || localStorage.getItem('sso_user');
+        if (ssoUser) {
+            try { this.currentUser = JSON.parse(ssoUser); return; } catch(e) {}
+        }
         const storedUser = localStorage.getItem('currentUser');
         if (storedUser) {
             this.currentUser = JSON.parse(storedUser);
@@ -60,6 +65,11 @@ class App {
         }
     }
 
+    _cookieGet(name) {
+        const match = document.cookie.match(new RegExp('(?:^|; )' + name + '=([^;]*)'));
+        return match ? decodeURIComponent(match[1]) : null;
+    }
+
     /**
      * API 스크립트 동적 로드
      */
@@ -360,16 +370,27 @@ class App {
      * 로그아웃
      */
     logout() {
-        localStorage.removeItem('access_token');
-        localStorage.removeItem('currentUser');
+        if (window.authManager) {
+            window.authManager.clearAuth();
+        } else {
+            localStorage.removeItem('access_token');
+            localStorage.removeItem('sso_token');
+            localStorage.removeItem('sso_user');
+            localStorage.removeItem('currentUser');
+        }
         this.redirectToLogin();
     }
 
     /**
-     * 로그인 페이지로 리다이렉트
+     * 중앙 로그인 페이지로 리다이렉트
      */
     redirectToLogin() {
-        window.location.href = '/index.html';
+        const hostname = window.location.hostname;
+        if (hostname.includes('technicalkorea.net')) {
+            window.location.href = window.location.protocol + '//tkfb.technicalkorea.net/login?redirect=' + encodeURIComponent(window.location.href);
+        } else {
+            window.location.href = window.location.protocol + '//' + hostname + ':30000/login?redirect=' + encodeURIComponent(window.location.href);
+        }
     }
 
     /**

system3-nonconformance/web/static/js/components/common-header.js

@@ -657,9 +657,20 @@ class CommonHeader {
      */
     static logout() {
         if (confirm('로그아웃 하시겠습니까?')) {
-            localStorage.removeItem('access_token');
-            localStorage.removeItem('currentUser');
-            window.location.href = '/index.html';
+            if (window.authManager) {
+                window.authManager.logout();
+            } else {
+                localStorage.removeItem('access_token');
+                localStorage.removeItem('sso_token');
+                localStorage.removeItem('sso_user');
+                localStorage.removeItem('currentUser');
+                var hostname = window.location.hostname;
+                if (hostname.includes('technicalkorea.net')) {
+                    window.location.href = window.location.protocol + '//tkfb.technicalkorea.net/login';
+                } else {
+                    window.location.href = window.location.protocol + '//' + hostname + ':30000/login';
+                }
+            }
         }
     }
 

system3-nonconformance/web/static/js/core/auth-manager.js

@@ -35,28 +35,70 @@ class AuthManager {
     }
     
     /**
-     * localStorage에서 사용자 정보 복원
+     * 쿠키에서 값 읽기
+     */
+    _cookieGet(name) {
+        const match = document.cookie.match(new RegExp('(?:^|; )' + name + '=([^;]*)'));
+        return match ? decodeURIComponent(match[1]) : null;
+    }
+
+    /**
+     * 쿠키 삭제
+     */
+    _cookieRemove(name) {
+        let cookie = name + '=; path=/; max-age=0';
+        if (window.location.hostname.includes('technicalkorea.net')) {
+            cookie += '; domain=.technicalkorea.net';
+        }
+        document.cookie = cookie;
+    }
+
+    /**
+     * SSO 토큰 가져오기 (쿠키 우선, localStorage 폴백)
+     */
+    _getToken() {
+        return this._cookieGet('sso_token') || localStorage.getItem('sso_token') || localStorage.getItem('access_token');
+    }
+
+    /**
+     * SSO 사용자 정보 가져오기 (쿠키 우선, localStorage 폴백)
+     */
+    _getUser() {
+        const ssoUser = this._cookieGet('sso_user') || localStorage.getItem('sso_user');
+        if (ssoUser) {
+            try { return JSON.parse(ssoUser); } catch(e) {}
+        }
+        const userStr = localStorage.getItem('currentUser');
+        return userStr ? JSON.parse(userStr) : null;
+    }
+
+    /**
+     * 중앙 로그인 URL
+     */
+    _getLoginUrl() {
+        const hostname = window.location.hostname;
+        if (hostname.includes('technicalkorea.net')) {
+            return window.location.protocol + '//tkfb.technicalkorea.net/login?redirect=' + encodeURIComponent(window.location.href);
+        }
+        return window.location.protocol + '//' + hostname + ':30000/login?redirect=' + encodeURIComponent(window.location.href);
+    }
+
+    /**
+     * 저장소에서 사용자 정보 복원 (SSO 쿠키 + localStorage)
      */
     restoreUserFromStorage() {
-        const token = localStorage.getItem('access_token');
-        const userStr = localStorage.getItem('currentUser');
-        
-        console.log('🔍 localStorage 확인:');
-        console.log('- 토큰 존재:', !!token);
-        console.log('- 사용자 정보 존재:', !!userStr);
-        
-        if (token && userStr) {
+        const token = this._getToken();
+        const user = this._getUser();
+
+        if (token && user) {
             try {
-                this.currentUser = JSON.parse(userStr);
+                this.currentUser = user;
                 this.isAuthenticated = true;
                 this.lastAuthCheck = Date.now();
-                console.log('✅ 저장된 사용자 정보 복원:', this.currentUser.username);
             } catch (error) {
-                console.error('❌ 사용자 정보 복원 실패:', error);
+                console.error('사용자 정보 복원 실패:', error);
                 this.clearAuth();
             }
-        } else {
-            console.log('❌ 토큰 또는 사용자 정보 없음 - 로그인 필요');
         }
     }
     
@@ -75,25 +117,17 @@ class AuthManager {
      * 인증 상태 확인 (필요시에만 API 호출)
      */
     async checkAuth() {
-        console.log('🔍 AuthManager.checkAuth() 호출됨');
-        console.log('- 현재 인증 상태:', this.isAuthenticated);
-        console.log('- 현재 사용자:', this.currentUser?.username || 'null');
-        
-        const token = localStorage.getItem('access_token');
+        const token = this._getToken();
         if (!token) {
-            console.log('❌ 토큰 없음 - 인증 실패');
             this.clearAuth();
             return null;
         }
-        
+
         // 최근에 체크했으면 캐시된 정보 사용
         if (this.isAuthenticated && !this.shouldCheckAuth()) {
-            console.log('✅ 캐시된 인증 정보 사용:', this.currentUser.username);
             return this.currentUser;
         }
-        
-        // API 호출이 필요한 경우
-        console.log('🔄 API 호출 필요 - refreshAuth 실행');
+
         return await this.refreshAuth();
     }
     
@@ -101,30 +135,23 @@ class AuthManager {
      * 강제로 인증 정보 새로고침 (API 호출)
      */
     async refreshAuth() {
-        console.log('🔄 인증 정보 새로고침 (API 호출)');
-        
         try {
-            // API가 로드될 때까지 대기
             await this.waitForAPI();
-            
+
             const user = await AuthAPI.getCurrentUser();
-            
+
             this.currentUser = user;
             this.isAuthenticated = true;
             this.lastAuthCheck = Date.now();
-            
+
             // localStorage 업데이트
             localStorage.setItem('currentUser', JSON.stringify(user));
-            
-            console.log('✅ 인증 정보 새로고침 완료:', user.username);
-            
-            // 리스너들에게 알림
+
             this.notifyListeners('auth-success', user);
-            
             return user;
-            
+
         } catch (error) {
-            console.error('❌ 인증 실패:', error);
+            console.error('인증 실패:', error);
             this.clearAuth();
             this.notifyListeners('auth-failed', error);
             throw error;
@@ -152,15 +179,21 @@ class AuthManager {
      * 인증 정보 클리어
      */
     clearAuth() {
-        console.log('🧹 인증 정보 클리어');
-        
         this.currentUser = null;
         this.isAuthenticated = false;
         this.lastAuthCheck = null;
-        
+
+        // SSO 쿠키 삭제
+        this._cookieRemove('sso_token');
+        this._cookieRemove('sso_user');
+        this._cookieRemove('sso_refresh_token');
+
+        // localStorage 삭제
         localStorage.removeItem('access_token');
+        localStorage.removeItem('sso_token');
+        localStorage.removeItem('sso_user');
         localStorage.removeItem('currentUser');
-        
+
         this.notifyListeners('auth-cleared');
     }
     
@@ -168,28 +201,23 @@ class AuthManager {
      * 로그인 처리
      */
     async login(username, password) {
-        console.log('🔑 로그인 시도:', username);
-        
         try {
             await this.waitForAPI();
             const data = await AuthAPI.login(username, password);
-            
+
             this.currentUser = data.user;
             this.isAuthenticated = true;
             this.lastAuthCheck = Date.now();
-            
+
             // localStorage 저장
             localStorage.setItem('access_token', data.access_token);
             localStorage.setItem('currentUser', JSON.stringify(data.user));
-            
-            console.log('✅ 로그인 성공:', data.user.username);
-            
+
             this.notifyListeners('login-success', data.user);
-            
             return data;
-            
+
         } catch (error) {
-            console.error('❌ 로그인 실패:', error);
+            console.error('로그인 실패:', error);
             this.clearAuth();
             throw error;
         }
@@ -199,25 +227,18 @@ class AuthManager {
      * 로그아웃 처리
      */
     logout() {
-        console.log('🚪 로그아웃');
-        
         this.clearAuth();
         this.notifyListeners('logout');
-        
-        // 로그인 페이지로 이동
-        window.location.href = '/index.html';
+        window.location.href = this._getLoginUrl();
     }
     
     /**
      * 토큰 만료 체크 타이머 설정
      */
     setupTokenExpiryCheck() {
-        // 30분마다 토큰 유효성 체크
         setInterval(() => {
             if (this.isAuthenticated) {
-                console.log('⏰ 정기 토큰 유효성 체크');
                 this.refreshAuth().catch(() => {
-                    console.log('🔄 토큰 만료 - 로그아웃 처리');
                     this.logout();
                 });
             }