fix: remove Google Fonts dependency + lazy-load page scripts
- CSS: drop @import fonts.googleapis (blocked by CSP style-src, unreachable in CN) - use system font stack with YaHei fallback - index.html: remove all 26 js/pages/*.js tags - core 4 scripts only - app.js: route-based lazy loading - PAGE_SCRIPTS map, loadScript with cache, async route() loads page scripts before render - cross-deps: home->ticket-create, reset defined in forgot.js
This commit is contained in:
@@ -97,12 +97,68 @@ const App = {
|
||||
closeModal() { document.getElementById('modal-overlay').classList.add('hidden'); },
|
||||
navigate(page, param) { location.hash = `#/${page}` + (param ? `/${param}` : ''); },
|
||||
|
||||
route() {
|
||||
// ===== 页面脚本懒加载: 按路由动态注入, 避免全量下发 =====
|
||||
_scriptCache: {},
|
||||
// 路由 → 依赖脚本(不带 .js 后缀); home 依赖 ticket-create(首页内嵌提交表单), reset 定义于 forgot.js
|
||||
PAGE_SCRIPTS: {
|
||||
home: ['home', 'ticket-create'],
|
||||
install: ['install'],
|
||||
login: ['login'],
|
||||
register: ['register'],
|
||||
forgot: ['forgot'],
|
||||
reset: ['forgot'],
|
||||
verify: ['verify'],
|
||||
dashboard: ['dashboard'],
|
||||
unclaimed: ['unclaimed'],
|
||||
tickets: ['tickets', 'ticket-create'],
|
||||
ticket: ['ticket-detail'],
|
||||
tracking: ['tracking'],
|
||||
users: ['users'],
|
||||
notifications: ['notifications'],
|
||||
'external-api': ['external-api'],
|
||||
'external-api-docs': ['external-api-docs'],
|
||||
sources: ['sources'],
|
||||
templates: ['templates'],
|
||||
settings: ['settings-page'],
|
||||
export: ['export-page'],
|
||||
polls: ['polls'],
|
||||
features: ['features'],
|
||||
feature: ['feature-detail'],
|
||||
servers: ['servers'],
|
||||
bans: ['bans'],
|
||||
logs: ['logs'],
|
||||
},
|
||||
loadScript(src) {
|
||||
if (this._scriptCache[src]) return this._scriptCache[src];
|
||||
const p = new Promise((resolve, reject) => {
|
||||
const s = document.createElement('script');
|
||||
s.src = src;
|
||||
s.onload = () => resolve();
|
||||
s.onerror = () => { delete this._scriptCache[src]; reject(new Error('脚本加载失败: ' + src)); };
|
||||
document.head.appendChild(s);
|
||||
});
|
||||
this._scriptCache[src] = p;
|
||||
return p;
|
||||
},
|
||||
async loadPageScripts(page) {
|
||||
const files = this.PAGE_SCRIPTS[page] || [page];
|
||||
for (const f of files) await this.loadScript(`js/pages/${f}.js`);
|
||||
},
|
||||
|
||||
async route() {
|
||||
const hash = location.hash || '#/home';
|
||||
const parts = hash.replace('#/', '').split('/');
|
||||
const page = parts[0];
|
||||
const param = parts.slice(1).join('/');
|
||||
|
||||
// 先加载当前路由所需页面脚本, 再渲染
|
||||
try { await this.loadPageScripts(page); }
|
||||
catch (e) {
|
||||
console.error('页面脚本加载失败:', e.message);
|
||||
document.getElementById('page-content').innerHTML = `<div class="card"><div class="card-b" style="text-align:center;color:var(--d)">页面资源加载失败, 请刷新重试</div></div>`;
|
||||
return;
|
||||
}
|
||||
|
||||
if (page === 'verify') {
|
||||
this.showPublic('verify');
|
||||
return;
|
||||
|
||||
Reference in New Issue
Block a user