浏览 AI使用教程
怎样追踪一个功能从页面、接口到数据库的调用链
页面提示保存成功，刷新后数据却消失，这类问题不能只盯着按钮组件。要沿事件、请求、服务层和数据库写入一路追下去，才能找到断点。
沿完整工作流推进
前一阶段的可检查结果，是下一阶段的输入；中间证据不足时停在当前阶段。
从一个“保存成功”按钮，顺着调用链查到数据为什么没落库
用户点击“保存资料”后页面提示成功，但刷新数据消失。开发者只找到 React 按钮组件，没有追到 API、服务层和数据库事务。
本页演示如何阅读一组一致的代码与日志。文件名、请求 ID 与日志均为教学构造，真实排错必须换成当前仓库证据。
- 页面、接口、服务和数据层均有位置
- 每跳的对象与状态变化可见
- 静态推断与运行证据已区分
先确认这次任务的起点、边界和交付
| 需要确认 | 本例内容 |
|---|---|
| 现有材料 | 教学代码中的请求固定为 PATCH /api/profile/42，request_id 为 req-7f31；前端调用 profileClient.save，路由调用 profileService.update。下方代码与日志都是示例材料，不是生产取证。 |
| 不能越过的边界 | 调用链每一跳写文件位置、输入和输出；没有日志或代码证据的关联标为假设；先只读，不改生产数据。 |
| 要交付的结果 | 带文件位置的调用链图 |
从“冻结入口”走到“用日志或测试验证”
| 当前阶段 | 实际处理 |
|---|---|
| 冻结入口 | 记录 URL、按钮、CLI 命令或接口请求，保存输入、用户身份、预期结果和一次真实调用。 |
| 追页面与状态 | 找到事件处理、状态来源、表单校验和请求封装，记文件、符号和触发条件。 |
| 追接口与业务逻辑 | 从路由到认证、校验、服务和错误处理，区分传输结构与业务规则。 |
| 追数据读写 | 确认模型、查询、事务、缓存和外部服务，标出主键、权限和可能副作用。 |
| 用日志或测试验证 | 增加或读取最小诊断证据，确认图上的每一跳真实发生，删掉仅凭命名推测的关系。 |
同一 PATCH 请求的三处片段
web/profileClient.mjs
前端发起请求
export async function save(id, patch) {
const response = await fetch(`/api/profile/${id}`, {
method: 'PATCH', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(patch)
});
if (!response.ok) throw new Error(`HTTP ${response.status}`);
return response.json();
}
api/profileRoute.mjs
故意保留缺陷的路由片段
app.patch('/api/profile/:id', async (req, res) => {
try {
await profileService.update(req.params.id, req.body);
res.status(200).json({ ok: true });
} catch (error) {
logger.error({ request_id: req.id, error: error.message });
res.status(200).json({ ok: true }); // 教学缺陷：失败仍报成功
}
});
教学日志
用请求标识对应，不能仅靠时间接近
request_id=req-7f31 method=PATCH path=/api/profile/42 request_id=req-7f31 service=profileService.update db_error=23514 request_id=req-7f31 transaction=rollback request_id=req-7f31 response_status=200
路由是已有 Express 应用中的节选，app、logger、profileService 的初始化不在本例；它是阅读输入，不是一份可直接启动的服务器。23514 在 PostgreSQL 中表示 check_violation，应继续查约束名称与字段。
每一跳对应代码或日志
| 层级 | 本例关系 | 证据 | 未证明的事项 |
|---|---|---|---|
| 页面请求 | save(42, patch) → PATCH /api/profile/42 | profileClient 的 URL 与 method | 按钮是否真的调用此模块须查 Network/调用方 |
| 路由 | PATCH处理器 → profileService.update | profileRoute 的注册与调用 | 生产是否部署同一版本 |
| 服务/数据库 | 同request_id出现23514和rollback | 示例日志 | 真实约束名称、字段与SQL |
| 响应 | catch仍返回200和ok:true | 路由代码与response_status | 修复后行为需测试 |
完成后的带文件位置的调用链图
根据所给示例，可确认路由 catch 分支吞掉异常并返回 HTTP 200；示例日志显示同一请求发生约束错误和回滚。待验证修复是让失败返回约定的错误响应，并增加失败路径测试。数据库实际数据、生产路由与缓存状态尚不能由这些教学片段证明。
为什么“文件链已经画出，真实请求仍对不上”还不能交付
文件链已经画出，真实请求仍对不上
- 原因
- 静态搜索找到同名函数但不是运行路径
- 怎么改
- 用请求 ID、网络面板和日志把运行证据挂到每一跳，删除未执行分支