Spaces:
Paused
Paused
File size: 5,207 Bytes
ea6c2a8 78963e3 ea6c2a8 78963e3 ea6c2a8 78963e3 9536fa0 78963e3 ea6c2a8 78963e3 9536fa0 78963e3 9536fa0 78963e3 9536fa0 78963e3 9536fa0 78963e3 9536fa0 78963e3 9536fa0 78963e3 9536fa0 78963e3 ea6c2a8 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 |
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>DeepSite - AI驱动的前端助手</title>
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
body {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: #f8f9fa;
color: #333;
text-align: center;
padding: 20px;
}
.container {
background: white;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
padding: 40px;
max-width: 600px;
width: 100%;
}
h1 {
margin-top: 0;
color: #0066cc;
}
p {
line-height: 1.6;
margin-bottom: 20px;
}
.hidden {
display: none;
}
.error {
color: #dc3545;
}
.success {
color: #198754;
}
.spinner {
border: 4px solid rgba(0, 0, 0, 0.1);
width: 36px;
height: 36px;
border-radius: 50%;
border-left-color: #0066cc;
animation: spin 1s linear infinite;
margin: 0 auto 20px;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style>
</head>
<body>
<div class="container">
<h1>DeepSite</h1>
<p>一个强大的 AI 驱动的前端开发助手，帮助你快速创建和优化网页。</p>
<div id="loading">
<div class="spinner"></div>
<p>应用正在加载中，请稍候...</p>
</div>
<div id="status-container">
<p id="status" class="status">正在检查服务状态...</p>
<div id="details" class="hidden"></div>
</div>
<div id="actions" class="hidden">
<p><a href="/" id="refresh-btn">刷新页面</a> | <a href="/debug" id="debug-btn" target="_blank">查看调试信息</a></p>
</div>
<script>
// 页面元素
const loadingEl = document.getElementById('loading');
const statusEl = document.getElementById('status');
const detailsEl = document.getElementById('details');
const actionsEl = document.getElementById('actions');
// 简单的健康检查
const checkHealth = async () => {
try {
statusEl.textContent = "正在连接服务器...";
statusEl.className = "";
// 添加随机参数避免缓存
const timestamp = new Date().getTime();
const response = await fetch(`/debug?t=${timestamp}`, {
headers: {
'Cache-Control': 'no-cache',
'Pragma': 'no-cache'
}
});
if (response.ok) {
try {
// 尝试解析 JSON
const data = await response.json();
// 健康检查成功
loadingEl.classList.add('hidden');
statusEl.textContent = "服务器连接成功！应用正在启动...";
statusEl.className = "success";
// 显示详情
detailsEl.innerHTML = `
<p>服务器信息:</p>
<ul>
<li>时间: ${data.time || '未知'}</li>
<li>端口: ${data.port || '未知'}</li>
<li>环境: ${data.env || '未知'}</li>
</ul>
`;
detailsEl.classList.remove('hidden');
actionsEl.classList.remove('hidden');
// 3秒后刷新
setTimeout(() => {
window.location.href = '/?success=1';
}, 3000);
} catch (jsonError) {
// 响应不是 JSON
statusEl.textContent = "服务器响应格式不正确，将在5秒后重试...";
statusEl.className = "error";
setTimeout(checkHealth, 5000);
}
} else {
statusEl.textContent = `服务器响应错误 (${response.status})，将在5秒后重试...`;
statusEl.className = "error";
setTimeout(checkHealth, 5000);
}
} catch (err) {
statusEl.textContent = `无法连接到服务器: ${err.message}，将在5秒后重试...`;
statusEl.className = "error";
setTimeout(checkHealth, 5000);
}
};
// 页面加载后延迟1秒再检查健康状态
window.addEventListener('load', () => {
setTimeout(checkHealth, 1000);
});
// 刷新按钮事件
document.getElementById('refresh-btn').addEventListener('click', (e) => {
e.preventDefault();
window.location.reload();
});
</script>
</div>
</body>
</html>
|