应将后端原始错误转换为带业务语义的前端提示：先用浏览器开发者工具定位接口错误类型，再用Codex基于真实错误样本生成映射规则，最后注入请求拦截器实现友好提示。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
当用户在前端点击登录按钮后看到“Internal Server Error”这种报错，客服根本没法判断是网络问题、账号错误还是系统维护，必须把后端接口的原始错误转换成带业务语义、可读性强、有操作指引的页面提示。
先确认错误是否真的来自接口
打开浏览器开发者工具 → 切换到 Network 标签页 → 点击触发报错的操作（比如提交表单）→ 找到对应请求 → 查看 Response 或 Preview 内容。如果返回的是纯 JSON 错误（如 【{"detail":"Invalid credentials"}】），说明后端已返回结构化错误，只是前端没解析；如果返回的是 HTML 页面或空响应，那问题不在接口层，先别动 Codex。
这一步跳过会直接导致后续所有提示词失效——Codex 只能处理已有结构的错误数据，不能凭空从 500 页面里抠出业务原因。
让 Codex 帮你生成错误映射规则
方法一：用模板指令快速生成基础映射表
在 Codex 中输入：
“请根据以下 FastAPI 接口错误响应，生成前端 Vue 3 的错误提示映射对象。只输出 JavaScript 对象字面量，不要解释，不要注释。”
然后粘贴你抓到的真实错误响应示例（至少包含 3 种不同 error key，如 detail、code、message）。
依托用户知识库、工作记录、项目文件、会议纪要、表格、图片、文稿及评审材料生成高质量职场汇报演示文稿。适用于试用期考核、转正述职、晋升答辩、年度总结、项目进度汇报、项目评审、方案说服、资源申请、部门规划、业务优化或管理决策类 PPT 制作；Codex 需先明确汇报目标、提取佐证材料、生成规范说明书、适配汇报时长、搭建内容大纲、设计每页幻灯片内容，最后生成附带讲稿与佐证材料核对清单的 PPTX 文件。
方法二：指定业务场景增强可读性
告诉 Codex：“把 {'detail': 'Email not verified'} 映射为‘邮箱未验证，请查收邮件并点击链接完成验证’，把 {'code': 'rate_limit_exceeded'} 映射为‘操作太频繁，请 60 秒后再试’。保持中文口语化，不出现 technical 词汇，每条提示末尾加句号。”
【注意：必须提供至少两个真实错误样本，否则 Codex 会虚构不存在的 code 字段】
注入到请求拦截器中
第一步：找到项目中统一处理 axios/fetch 响应的地方，通常是 src/utils/request.ts 或 src/api/index.js。
第二步：在响应拦截器的 error 分支里，插入 Codex 生成的映射逻辑 → 调用 message.error() 或 useMessage().error() 显示友好提示。
第三步：对 status >= 400 且 response.data 存在的请求，执行错误码匹配 → 匹配成功则阻止默认错误弹窗，改用业务提示。
这一步做完后，用户再遇到验证码错误、手机号格式不对、余额不足等场景，看到的就不再是“Request failed with status code 400”，而是“手机号格式不正确，请输入11位数字”。
