设置界面更新

static/js/api.js

@@ -20,8 +20,16 @@ async function apiRequest(endpoint, method = 'GET', data = null) {
     options.body = JSON.stringify(data);
   }
   
+  // 添加超时处理
+  const timeoutPromise = new Promise((_, reject) => {
+    setTimeout(() => {
+      reject(new Error('请求超时'));
+    }, 10000); // 10秒超时
+  });
+  
   try {
-    const response = await fetch(url, options);
+    // 竞争：请求或超时
+    const response = await Promise.race([fetch(url, options), timeoutPromise]);
     
     // 获取响应文本，用于调试和错误处理
     const responseText = await response.text();
@@ -55,12 +63,18 @@ async function apiRequest(endpoint, method = 'GET', data = null) {
       // 首先检查响应文本是否为空
       if (!responseText || responseText.trim() === '') {
         console.warn('空响应文本');
-        return {};
+        return null; // 返回null表示空响应
       }
       
       // 尝试解析JSON
       const parsedData = JSON.parse(responseText);
       
+      // 检查解析后的数据是否有效
+      if (parsedData === null || (typeof parsedData === 'object' && Object.keys(parsedData).length === 0)) {
+        console.warn('解析后的数据为空');
+        return null;
+      }
+      
       // 限制所有数字为两位小数
       const formatNumbers = (obj) => {
         if (typeof obj === 'number') {
@@ -93,13 +107,13 @@ async function apiRequest(endpoint, method = 'GET', data = null) {
         console.error('位置66附近的字符:', responseText.substring(60, 75));
       }
       
-      // 返回空数组作为默认值，避免页面功能完全中断
-      console.warn('使用默认空数组作为响应');
-      return [];
+      // 返回错误对象，让上层处理
+      return { error: 'JSON解析错误' };
     }
   } catch (error) {
     console.error('API请求错误:', error);
-    throw error;
+    // 返回错误对象，而不是抛出异常，让上层处理
+    return { error: error.message };
   }
 }
 
@@ -120,6 +134,12 @@ const api = {
   // 获取最近屏蔽域名
   getRecentBlockedDomains: () => apiRequest('/recent-blocked?t=' + Date.now()),
   
+  // 获取TOP客户端
+  getTopClients: () => apiRequest('/top-clients?t=' + Date.now()),
+  
+  // 获取TOP域名
+  getTopDomains: () => apiRequest('/top-domains?t=' + Date.now()),
+  
   // 获取小时统计
   getHourlyStats: () => apiRequest('/hourly-stats?t=' + Date.now()),