## 借助 CodeBuddy 搞定忘记哪家 AI 糊的表空间展示页面的半成品

大概年初忘记用哪家 AI 糊了一个 oracle 表空间展示页面（index.html）和趋势增长页面(trend.html)，由于当时连接网络不稳定，在修改功能的时候，糊了一部分，网络经常断开导致网页没有糊完，相当于一个半成品，目前停留在 数据无法正常加载，一直提示正在加载数据…，之前的版本数据是可以加载的，但是在修改其他功能的时候，网络不稳定，导致不知道哪里修改了一部分，导致空间展示页面（index.html）无法加载数据，但是趋势增长页面有数据。
以下是借助 CodeBuddy 来进行页面的 debug：
先看下目前的页面截图，一直显示在正在加载数据…
![不显示数据的index页面](https://developer.qcloudimg.com/http-save/yehe-1084545/34160126d1c30b934f33810fad42e819.png)
我通过 CodeBuddy ide 直接打开存放项目的文件夹，直奔主题：
>index.html 网页通过API 获取的数据展示，现在网页打开无法获取数据，一直显示再加载数据


![image-20251109213905733](https://developer.qcloudimg.com/http-save/yehe-1084545/943b1e8f605e515aa195a71b9b3ddbec.png)
CodeBuddy 一点不含糊，直接给出一个 api 测试页面：
![image-20251109214046010](https://developer.qcloudimg.com/http-save/yehe-1084545/986e89f62030d36660a310de2932f84a.png)
可以看到他的测试页面：直接访问：http://localhost:8000/test-api.html ，点击测试就可以直接进行 api的测试，包括4个步骤：
![image-20251109214220788](https://developer.qcloudimg.com/http-save/yehe-1084545/911acdc2163fc89c04ece01148f6e83b.png)
详细测试日志：
>[21:42:10] ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[21:42:10] 🚀 开始 API 连接测试...
[21:42:10] ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[21:42:10] 📡 步骤 1/4: 测试网络连接...
[21:42:11] ✅ 网络连接正常
[21:42:11]
[21:42:11] 🔍 步骤 2/4: 检查 API 端点...
[21:42:11] 📍 端点: https://uxxxxxxxxxxxx.com/api/v1beta/app/dataapp-tiTAMIaa/endpoint/tbsinfo
[21:42:11]
[21:42:11] 🎯 步骤 3/4: 发送测试请求...
[21:42:11] 📮 请求 URL: https://uxxxxxxxxxxxx.com/api/v1beta/app/dataapp-tiTAMIaa/endpoint/tbsinfo?id=131&host=%
[21:42:11] 🔑 认证方式: Basic Auth
[21:42:12] ⏱️ 响应时间: 805ms
[21:42:12] 📊 状态码: 200
[21:42:12]
[21:42:12] 📦 步骤 4/4: 解析响应数据...
[21:42:12] 📄 Content-Type: application/json; charset=utf-8
[21:42:12] ✅ 成功获取 JSON 数据
[21:42:12] 📊 数据类型: object
[21:42:12] 📋 数据格式: Object.data.rows (0 条记录)
[21:42:12]
[21:42:12] ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[21:42:12] 🎉 测试完成！API 连接正常
[21:42:12] ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[21:42:12]
[21:42:12] 📋 响应数据预览:
[21:42:12] { "type": "sql_endpoint", "data": { "columns": [ { "col": "id", "data_type": "INT", "nullable": false }, { "col": "status", "data_type": "VARCHAR", "nullable": false }, {
………………
太长省略。

可以看到api 测试数据是0。我把测试结果发给他，他又 巴拉巴拉给我分析了一大堆
![image-20251109215125284](https://developer.qcloudimg.com/http-save/yehe-1084545/7bcea4aede958c109d7ae644d4a0c75e.png)
又检查api的参数等
![image-20251109215159802](https://developer.qcloudimg.com/http-save/yehe-1084545/fa6b215ec3b56996aafeedfb3734a14c.png)
ta 又继续分析：
![image-20251109215239040](https://developer.qcloudimg.com/http-save/yehe-1084545/5b88146f143e5f3e0975414c24f29321.png)
我感觉分析的有点偏离轨道，我就取消了当前的分析，然后让他参考下 trend页面：`参考下 trend.html 页面的API，现在 trend.html 页面的数据获取正常`
![image-20251109215401419](https://developer.qcloudimg.com/http-save/yehe-1084545/2869068873d6596eb332a0aae6d75e91.png)
然后他又残酷 trend 页面给了我一个 快速api测试的页面：http://localhost:8000/quick-test.html
![image-20251109215529764](https://developer.qcloudimg.com/http-save/yehe-1084545/0249c9af35d1779cb31ac12029052d9a.png)
我访问 快速测试页面：
![image-20251109215557660](https://developer.qcloudimg.com/http-save/yehe-1084545/2cf1e342c1357a13549e6f8e43647c1a.png)
可以看到是又数据的，我把结构之间发给他，他又爽快的回复我：
![image-20251109215739047](https://developer.qcloudimg.com/http-save/yehe-1084545/ac77b6f28582f9fd4e86d6f3379885ca.png)
他经过一些修改之后，让我重新打开页面，并通过F12 进行查看。
![image-20251109215940988](https://developer.qcloudimg.com/http-save/yehe-1084545/df2aa41007336584336cdd7cfcaaf1cb.png)
说实话 F12 查看控制台我都不会，然后我继续问道：查看控制台输出，应该会看到： 这个如何查看？
![image-20251109220019818](https://developer.qcloudimg.com/http-save/yehe-1084545/9c29eca874a2e7103d24251ea5d84afb.png)
他就给了我多种方法，多种浏览器进行查看的方法，这是太全面了。

> 好的！让我详细教你如何查看浏览器控制台：
> ## 📖 如何打开浏览器控制台（[开发者工具]
> ### 方法 1：使用键盘快捷键（最快）
> **Windows/Linux:**
> - 按 `F12` 键
> - 或者按 `Ctrl + Shift + I`
> - 或者按 `Ctrl + Shift + J` （直接打开 Console 标签）
> **Mac:**
> - 按 `Cmd + Option + I`
> - 或者按 `Cmd + Option + J` （直接打开 Console 标签）
> 
> 方法 2：通过浏览器菜单**Chrome 浏览器:**
> 1. 点击右上角的三个点 ⋮
> 2. 选择"更多工具" → "开发者工具"
> **Firefox 浏览器:**
> 1. 点击右上角的三条横线 ≡
> 2. 选择"更多工具" → "Web 开发者工具"
> **Safari 浏览器:**
> 1. 先启用开发者菜单：Safari → 偏好设置 → 高级 → 勾选"在菜单栏中显示开发菜单"
> 2. 然后：开发 → 显示 JavaScript 控制台
> **Edge 浏览器:**
> 1. 点击右上角的三个点 ⋯
> 2. 选择"更多工具" → "开发人员工具"
> ### 方法 3：右键菜单
> 1. 在网页任意位置**右键点击**
> 2. 选择"检查"或"审查元素”
> ## 打开控制台后的操作步骤
> 打开控制台后，你会看到一个开发者工具面板，按以下步骤操作：
> ### 步骤 1：切换到 Console（控制台）标签
> - 在开发者工具的顶部，找到并点击 **"Console"** 标签
> - 这里会显示所有 JavaScript 日志输出
> ### 步骤 2：刷新页面
> - 按 `Ctrl + R` （Windows/Linux）或 `Cmd + R` （Mac）刷新
> - 或者按 `Ctrl + Shift + R` （强制刷新，清除缓存）
> ### 步骤 3：查看日志输出
> 在 Console 中，你应该能看到类似这样的输出：
> 代码语言：TXT
> 自动换行
> AI代码解释
> ```
>    🚀 开始加载数据...
>    📍 API URL: https://c001.6ps.org/api/v1beta/app/dataapp-tiTAMIaa/endpoint/tbsinfo?id=131&host=%25
>    🖥️  Host 参数: %
> 
> ```
>
> 这简直详细的不要不要。

我打开控制台，看到如下：

![image-20251109220243878](https://developer.qcloudimg.com/http-save/yehe-1084545/9eb8601ed23200b06a2a26c589bc1572.png)
可以看到控制台，有个明显的红色抱错：TypeError: null is not an object (evaluating 'currentHostSpan.textContent = '所有主机'')，直接复制错误代码给 CodeBuddy，
![image-20251109220405675](https://developer.qcloudimg.com/http-save/yehe-1084545/a192ea1335ce12f9ff17b63808d2c52b.png)
![image-20251109220432091](https://developer.qcloudimg.com/http-save/yehe-1084545/48e6a1798d0c353262a2839e0073e21a.png)
又给出两个方法，很给力这次，我只用了第一个方法就发现已经修复了。index页面有数据了。
![image-20251109220840521](https://developer.qcloudimg.com/http-save/yehe-1084545/2374bf724233f70a0c8ad86e73560926.png)
至此，借助 CodeBuddy 搞定忘记哪家 AI 糊的表空间展示页面的半成品。


● 需 @CodeBuddy 官方账号
● 需带以下标签👇：（选择文章相关标签即可）
# CodeBuddy
# CodeBuddyIDE
# CodeBuddyCode
# 无界生成力

大概年初忘记用哪家 AI 糊了一个 oracle 表空间展示页面（index.html）和趋势增长页面(trend.html)，由于当时连接网络不稳定，在修改功能的时候，糊了一部分，网络经常断开导致网页没有糊完，相当于一个半成品，目前停留在 数据无法正常加载，一直提示正在加载数据…，之前的版本数据是可以加载的，但是在修改其他功能的时候，网络不稳定，导致不知道哪里修改了一部分，导致空间展示页面（index.html）无法加载数据，但是趋势增长页面有数据。以下是借助 CodeBuddy 来进行页面的 debug：先看下目前的页面截图，一直显示在正在加载数据…我通过 CodeBuddy ide 直接打开存放项目的文件夹，直奔主题：

拖了半年的代码‘烂尾楼’，被 CodeBuddy IDE 的智能修复一夜救活

借助 CodeBuddyIDE 的 智能调试修复功能，将拖了半年的 半成品高效重构为可交付应用

开发工具

前端

数据库

CodeBuddy IDE帮助修复Oracle表空间展示页面数据加载问题。通过API测试、控制台调试快速定位到"TypeError:null is not an object"错误，仅用第一个解决方案就成功恢复index.html页面数据加载功能。展示了CodeBuddy强大的调试能力和开发者友好特性。

Windows

Linux

JSON

AI驱动 智领未来

coding

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

拖了半年的代码‘烂尾楼’，被 CodeBuddy IDE 的智能修复一夜救活-腾讯云开发者社区-腾讯云

拖了半年的代码‘烂尾楼’，被 CodeBuddy IDE 的智能修复一夜救活

拖了半年的代码‘烂尾楼’，被 CodeBuddy IDE 的智能修复一夜救活

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐