🎉 Apifox 集成设置完成

✅ 已完成的配置

1. 核心文件

文件	说明
.env.apifox	Apifox 凭证配置文件（需要您填写）
.env.apifox.example	配置文件模板
scripts/apifox-to-openapi.js	Apifox → OpenAPI 转换工具
scripts/test-apifox-connection.js	Apifox 连接测试工具
scripts/apifox-sync.js	备用的独立同步工具

2. 文档文件

文件	说明
QUICKSTART_APIFOX.md	快速开始指南
docs/apifox-integration-guide.md	完整集成指南

3. 配置更新

文件	更新内容
package.json	添加了 api:sync 和 api:test 命令
.gitignore	添加了 .env.apifox 以保护敏感信息

🚀 开始使用

步骤 1：配置 Apifox 凭证

# 1. 复制示例配置
cp .env.apifox.example .env.apifox

# 2. 编辑 .env.apifox，填写您的 Apifox 信息
# VITE_APIFOX_TOKEN=aps-your_token_here
# VITE_APIFOX_PROJECT_ID=your_project_id_here

步骤 2：测试连接

# 测试 Apifox 连接是否正常
pnpm api:test

这个命令会：

• ✅ 验证配置文件格式
• ✅ 测试 API Token 是否有效
• ✅ 显示项目基本信息
• ✅ 列出前 10 个接口

步骤 3：同步 API

# 从 Apifox 同步所有接口
pnpm api:sync

这个命令会：

• ✅ 从 Apifox 获取所有接口数据
• ✅ 转换为 OpenAPI 3.0 格式
• ✅ 保存到 docs/api-specs/ 目录
• ✅ 自动生成 API 代码到 src/api/ 目录

📋 可用命令

命令	说明
pnpm api:test	测试 Apifox 连接
pnpm api:sync	从 Apifox 同步 API（推荐）
pnpm api:generate	从 OpenAPI 文档生成代码

💡 使用示例

在组件中使用生成的 API

// 1. 导入生成的 API
import { getUserInfoAPI } from '@/api/user'
import { getProductListAPI } from '@/api/product'

// 2. 调用 API
const res = await getUserInfoAPI({ userId: '123' })

// 3. 检查返回值
if (res.code === 1) {
  console.log('成功:', res.data)
} else {
  console.error('失败:', res.msg)
}

📂 生成的文件结构

docs/api-specs/           # OpenAPI 文档（Markdown）
├── user/                 # 用户模块
│   ├── get-userinfo.md
│   └── post-login.md
└── product/              # 产品模块
    └── get-list.md

src/api/                  # 生成的 API 代码
├── user.js               # 用户模块 API
└── product.js            # 产品模块 API

🔍 故障排查

问题 1：找不到 .env.apifox 文件

解决方案：

cp .env.apifox.example .env.apifox

问题 2：提示"HTTP 401"

原因：API Token 无效

解决方案：

1. 检查 Token 是否正确
2. 在 Apifox 中重新生成 Token
3. 更新 .env.apifox 文件

问题 3：提示"项目不存在"

原因：项目 ID 错误或无权限

解决方案：

1. 检查项目 ID 是否正确
2. 确认账号有该项目的访问权限
3. 检查 Apifox 项目设置

📚 更多资源

• 快速开始: QUICKSTART_APIFOX.md
• 完整指南: apifox-integration-guide.md
• Apifox 文档: https://apifox.com/docs/

🛡️ 安全提醒

⚠️ 重要：

• .env.apifox 包含敏感信息，已被添加到 .gitignore
• 请勿将 .env.apifox 提交到 Git
• 定期轮换 API Token
• 在 Apifox 中设置合适的权限

🎯 下一步

1. ✅ 配置 .env.apifox 文件
2. ✅ 运行 pnpm api:test 测试连接
3. ✅ 运行 pnpm api:sync 同步 API
4. ✅ 在组件中使用生成的 API

---

需要帮助？ 查看 完整集成指南 或运行 pnpm api:test 诊断问题

最后更新: 2026-01-30