hyungi/TK-FB-Project
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 스크립트 로딩 순서 및 의존성 문제 해결

Browse Source 
🐛 해결된 문제:
- auth-check.js의 ES6 import 문법 오류
- window.apiCall is not a function 오류
- 스크립트 로딩 순서로 인한 의존성 문제

🔧 수정 내용:
1. auth-check.js:
   - ES6 import 제거 → 함수 직접 구현
   - isLoggedIn, getUser, clearAuthData 내장
   - 모듈 의존성 완전 제거

2. 스크립트 로딩 순서 최적화:
   - api-config.js: defer 제거 (즉시 로드)
   - auth-check.js: defer 유지
   - modern-dashboard.js: defer 유지

3. modern-dashboard.js:
   - API 함수 로드 대기 로직 추가
   - 최대 5초 대기 후 오류 처리
   - 안전한 초기화 보장

✅ 개선 효과:
- 모든 JavaScript 오류 해결
- 안정적인 스크립트 로딩 순서
- API 함수 의존성 문제 해결
- 대시보드 정상 초기화 보장

테스트: http://localhost:20000/pages/dashboard/group-leader.html
This commit is contained in:
Hyungi Ahn
2025-11-03 11:59:06 +09:00
parent b7388d47b4
commit e9d78e48a7
3 changed files with 34 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
web-ui/js/auth-check.js
View File

@@ -1,5 +1,20 @@
// /js/auth-check.js // /js/auth-check.js
import { isLoggedIn, getUser, clearAuthData } from './auth.js'; // auth.js의 함수들을 직접 구현 (모듈 의존성 제거)
function isLoggedIn() {
const token = localStorage.getItem('token');
return token && token !== 'undefined' && token !== 'null';
}
function getUser() {
const user = localStorage.getItem('user');
return user ? JSON.parse(user) : null;
}
function clearAuthData() {
localStorage.removeItem('token');
localStorage.removeItem('user');
}
// 즉시 실행 함수로 스코프를 보호하고 로직을 실행 // 즉시 실행 함수로 스코프를 보호하고 로직을 실행
(function() { (function() {

15
web-ui/js/modern-dashboard.js
View File

@@ -44,6 +44,21 @@ const elements = {
// ========== 초기화 ========== // // ========== 초기화 ========== //
document.addEventListener('DOMContentLoaded', async () => { document.addEventListener('DOMContentLoaded', async () => {
// API 함수가 로드될 때까지 기다림
let retryCount = 0;
const maxRetries = 50; // 5초 대기
while (!window.apiCall && retryCount < maxRetries) {
await new Promise(resolve => setTimeout(resolve, 100));
retryCount++;
}
if (!window.apiCall) {
console.error('❌ API 함수를 로드할 수 없습니다.');
showToast('시스템을 초기화할 수 없습니다. 페이지를 새로고침해주세요.', 'error');
return;
}
try { try {
await initializeDashboard(); await initializeDashboard();
} catch (error) { } catch (error) {

5
web-ui/pages/dashboard/group-leader.html
View File

@@ -10,9 +10,10 @@
<link rel="stylesheet" href="/css/modern-dashboard.css"> <link rel="stylesheet" href="/css/modern-dashboard.css">
<link rel="icon" type="image/png" href="/img/favicon.png"> <link rel="icon" type="image/png" href="/img/favicon.png">
<!-- 스크립트 --> <!-- 스크립트 (순서 중요: api-config.js가 먼저 로드되어야 함) -->
<script src="/js/api-config.js"></script>
<script src="/js/auth-check.js" defer></script> <script src="/js/auth-check.js" defer></script>
<script type="module" src="/js/modern-dashboard.js" defer></script> <script src="/js/modern-dashboard.js" defer></script>
</head> </head>
<body> <body>
<!-- 메인 컨테이너 --> <!-- 메인 컨테이너 -->