index.html 处理 json 文件不存在情况

html/index.html

@@ -84,7 +84,7 @@
         <input type="checkbox" class="filter_checkbox" name="auto_refresh" id="auto_refresh">自动拉取<span
             id="auto_refresh_countdown"></span>
     </label>
-    <span id="update-finish-info" style="color: green; font-weight: bold; display: none;">数据已更新</span>
+    <span id="update-finish-info" style="color: green; font-weight: bold; display: none;">拉取成功，数据已更新</span>
     <table id="list"></table>
     <script>
         /**
@@ -167,7 +167,7 @@
 
         // 绑定复选框改变事件
         for (let i = 0; i < filterCheckbox.length; i++) {
-            console.log(filterCheckbox[i]);
+            // console.log(filterCheckbox[i]);
             filterCheckbox[i].onchange = function () {
                 render();
             };
@@ -200,7 +200,7 @@
         // 根据屏幕判断要显示哪些字段
         // 此时还未拉取数据，所以进入 render 函数会直接返回，不会多次渲染
         let initWidth = document.body.offsetWidth;
-        console.log(initWidth);
+        // console.log(initWidth);
         if (initWidth < 400) {
             btnShowNone.click();
             btnShowNone.innerHTML += "(默认)";
@@ -226,8 +226,18 @@
             xhr.open("GET", "../data/latest.json?t=" + Date.now(), true);
             xhr.send();
             xhr.onreadystatechange = function () {
-                if (xhr.readyState == 4 && xhr.status == 200) {
-                    hotBandData = JSON.parse(xhr.responseText);
+                if (xhr.readyState !== 4) return;
+
+                if (xhr.status == 200) {
+                    try {
+                        hotBandData = JSON.parse(xhr.responseText);
+                        if (!hotBandData.data || typeof hotBandData.data !== 'object')
+                            throw new Error("data is undefined or not an object");
+                    } catch (e) {
+                        console.error("[error]", "\n", e, "\n", "\n", "[xhr.responseText]", "\n", xhr.responseText);
+                        alert("latest.json 文件解析失败，请检查文件");
+                        return;
+                    }
                     console.log(hotBandData);
 
                     // 更新时间
@@ -237,6 +247,8 @@
 
                     // 渲染榜单
                     render();
+                } else if (xhr.status == 404) {
+                    alert("data 目录下未找到 latest.json 文件，可能的原因：\n您还没有运行脚本拉取数据，请先运行脚本，然后刷新页面");
                 }
             }
         }