datawhalechina/hello-agents · warning

系统状态异常

Error message

系统状态异常

What it means

'系统状态异常' (system status abnormal) is thrown by checkSystemStatus() in Apricity-InnocoreAI's inline index.html script when GET /health resolves but returns a non-OK status. It is a deliberate downgrade of an HTTP-level failure into the same catch path as network errors, so the status widget shows '系统连接失败' (system connection failed) either way. The original status code is discarded, making 500 vs 503 indistinguishable in the UI.

Source

Thrown at Co-creation-projects/Apricity-InnocoreAI/frontend/index.html:776

                    } else {
                        workflowCard.style.display = 'none';
                    }
                });
            });
        }

        // 检查系统状态
        async function checkSystemStatus() {
            const statusDiv = document.getElementById('systemStatus');
            try {
                const response = await fetch('/health');
                const data = await response.json();

                if (response.ok) {
                    statusDiv.className = 'status';
                    statusDiv.innerHTML = `✅ 系统运行正常 | 状态: ${data.status} | 时间: ${new Date().toLocaleString()}`;
                } else {
                    throw new Error('系统状态异常');
                }
            } catch (error) {
                statusDiv.className = 'error';
                statusDiv.innerHTML = `❌ 系统连接失败: ${error.message}`;
            }
        }

        // 激活智能体
        function activateAgent(agentType) {
            // 重置所有卡片和面板
            document.querySelectorAll('.feature-card').forEach(card => {
                card.classList.remove('active');
            });
            document.querySelectorAll('.interaction-panel').forEach(panel => {
                panel.classList.remove('active');
            });

            // 激活选中的智能体

View on GitHub (pinned to 606a07d341)

Solutions

  1. curl the /health endpoint directly from the same origin the page is served from to see the real status/body.
  2. If the status is 404, align the health route path or serve the frontend behind a proxy that forwards /health to the backend.
  3. If 503/500, read the health endpoint's body/logs — a dependency (DB, model service) is failing its check.
  4. Include response.status in the thrown message so the UI distinguishes causes (see exampleFix).

Example fix

// before
} else {
  throw new Error('系统状态异常');
}

// after
} else {
  throw new Error(`系统状态异常 (HTTP ${response.status})`);
}
Defensive patterns

Strategy: try-catch

Type guard

function isHealthyPayload(data: unknown): data is { status: string } {
  return typeof data === 'object' && data !== null && typeof (data as { status?: unknown }).status === 'string';
}

Try / catch

try {
  const response = await fetch('/health');
  if (!response.ok) throw new Error(`系统状态异常 (HTTP ${response.status})`);
  const data = await response.json();
  if (!isHealthyPayload(data)) throw new Error('健康检查响应格式异常');
  renderHealthy(data);
} catch (error) {
  renderOffline((error as Error).message);
}

Prevention

When it happens

Trigger: GET /health returns 4xx/5xx: backend health endpoint reporting degraded state (e.g. DB or model-service check failing → 503), route not implemented at the served origin (404), or the static page served from a different origin without the /api proxy so /health 404s. Distinguished from fetch() rejection (backend fully down), which skips the throw and lands in catch directly.

Common situations: Opening index.html via file:// or a static host that doesn't proxy /health; backend up but its dependencies unhealthy; health route path mismatch (/health vs /api/health).

Related errors


AI-assisted analysis of datawhalechina/hello-agents@606a07d341 (2026-08-14). Data as JSON: /api/errors/004bf427ca0ec703. Report an issue: GitHub.