作为一个Web前端开发者，开发过程中除了写业务代码，剩余大多数时间都花在了API的联调上。为了解决这个问题，大多数开发者会选择Mock接口的方案，但是前端领域的几种常用 Mock 方案都需要一定的学习成本。那么有没更优雅便捷的方案可以提高开发者开发效率实现下班自由呢。

一款对前端开发者优化的 API 管理工具

假设我们现在要开发一个获取用户信息的功能，常规流程是这样的：

• 1、接口设计。

• 2、后端开发接口(此时前端开发页面)。

• 3、后端接口开发测试完成，交付前端进行开发调试测试。

现在我们使用 Apifox 来参与开发会怎么样呢？

1.接口设计

在接口设计的环节，我们使用 Apifox 进行，通过 Apifox 可以完全可视化的形式进行一个接口的设计，打开 Apifox，新建一个接口：



接口文档设计完成后，点击保存，Apifox 会保存此接口生成一个接口文档：




2. 接口测试

在接口设计完成后，Apifox 会保存接口文档，文档内有接口的请求与返回信息，此时可以使用 Apifox 内置的 Mock 服务进行调试：



可以看到接口返回数据中自动 Mock 返回了数据，并且 Apifox 会根据常用字段命名，智能的得出人性化的 Mock 数据，并且会根据接口设计时每个字段的数据类型，去校验接口返回数据对应字段的数据类型。

{
    "data": {
        "username": "廖磊",  // 中文姓名
        "avatar": "http://dummyimage.com/100x100" // 头像URL
    },
    "code": 100, // 接口状态码
    "message": "occaecat aute proident non" // 接口返回额外信息
}

3. 前端调试

在 Apifox 运行时，我们可以在外部直接访问起内置的 Mock 服务，这意味者，前端开发者不需要单独写 Mock 代码，在接口文档设计完成的时候，便可以直接调试！

我们把刚刚调试的 URL 直接复制带浏览器中，可以直接返回数据！那么我们便可以直接在项目中使用。



Apifox 还提供了高级Mock的功能(具体文档可看)， 我们预期在传入id=1的时候，接口能返回我们想要的数据，例如：

{
    "data": {
        "username": "zh",
        "avatar": "http://dummyimage.com/100x100"
    },
    "code": 200,
    "message": "success"
}

使用 Apifox 的高级Mock功能添加一个：



再次发起请求，此时在参数id赋值为1：




可以看到得到了我们预期的返回！


那么我们在前端开发时，便可以直接使用 Apifox 的 Mock 服务进行接口联调，等到后端同学完成了接口开发后，便可以无缝切换为真实的接口，因为 Apifox 是以接口设计优先，前后端都严格依照接口文档定义来开发。这样对前端如此友好的工具，用了就回不去！

Apifox 是什么

Apifox 是 API 文档、API 调试、API Mock、API 自动化测试一体化协作平台，定位 Postman + Swagger + Mock + JMeter。通过一套系统、一份数据，解决多个系统之间的数据同步问题。只要定义好 API 文档，API 调试、API 数据 Mock、API 自动化测试就可以直接使用，无需再次定义；API 文档和 API 开发调试使用同一个工具，API 调试完成后即可保证和 API 文档定义完全一致。高效、及时、准确！

1、Apifox 定位

Apifox = Postman + Swagger + Mock + JMeter

Apifox 是 API 文档、API 调试、API Mock、API 自动化测试一体化协作平台。

通过一套系统、一份数据，解决多个系统之间的数据同步问题。只要定义好接口文档，接口调试、数据 Mock、接口测试就可以直接使用，无需再次定义；接口文档和接口开发调试使用同一个工具，接口调试完成后即可保证和接口文档定义完全一致。高效、及时、准确！

2、Apifox 宗旨

节省研发团队的每一分钟！

3、Apifox 功能

• 接口设计：Apifox 接口文档遵循 OpenApi 3.0 (原 Swagger)、JSON Schema 规范的同时，提供了非常好用的可视化文档管理功能，零学习成本，非常高效。并且支持在线分享接口文档。

• 数据模型：可复用的数据结构，定义接口返回数据结构及请求参数数据结构（仅 JSON 和 XML 模式）时可直接引用。支持模型直接嵌套引用，直接 JSON/XML 智能导入，支持 oneOf、allOf 等高级组合模式。

• 接口调试：Postman 有的功能，比如环境变量、前置/后置脚本、Cookie/Session 全局共享 等功能，Apifox 都有，并且比 Postman 更高效好用。接口运行完之后点击保存为用例按钮，即可生成接口用例，后续可直接运行接口用例，无需再输入参数，非常方便。自定义脚本 100% 兼容 Postman 语法，并且支持运行 javascript、java、python、php、js、BeanShell、go、shell、ruby、lua 等各种语言代码。

• 接口用例：通常一个接口会有多种情况用例，比如参数正确用例、参数错误用例、数据为空用例、不同数据状态用例等等。运行接口用例时会自动校验数据正确性，用接口用例来调试接口非常高效。

• 接口数据 Mock：内置 Mock.js 规则引擎，非常方便 mock 出各种数据，并且可以在定义数据结构的同时写好 mock 规则。支持添加“期望”，根据请求参数返回不同 mock 数据。最重要的是 Apifox 零配置 即可 Mock 出非常人性化的数据，具体在本文后面介绍。

• 数据库操作：支持读取数据库数据，作为接口请求参数使用。支持读取数据库数据，用来校验(断言)接口请求是否成功。

• 接口自动化测试：提供接口集合测试，可以通过选择接口（或接口用例）快速创建测试集。目前接口自动化测试更多功能还在开发中，敬请期待！目标是： JMeter 有的功能基本都会有，并且要更好用。

• 快捷调试：类似 Postman 的接口调试方式，主要用途为临时调试一些无需文档化的接口，无需提前定义接口即可快速调试。

• 代码生成：根据接口及数据数据模型定义，系统自动生成接口请求代码、前端业务代码及后端业务代码。

• 团队协作：Apifox 天生就是为团队协作而生的，接口云端实时同步更新，成熟的团队/项目/成员权限管理，满足各类企业的需求。

Apifox 做的不仅仅是数据打通

如果你认为 Apifox 只做了数据打通，来提升研发团队的效率，那就错了。Apifox 还做了非常多的创新，来提升开发人员的效率。

1、接口支持“用例管理”

通常一个接口会有多种情况用例，比如 正确用例 参数错误用例 数据为空用例 不同数据状态用例。定义接口的时候定义好这些不同状态的用例，接口调试的时候直接运行，非常高效。

2、“数据模型”定义、引用

可以独立定义数据模型，接口定义时可以直接引用数据模型，数据模型之间也可以相互引用。同样的数据结构，只需要定义一次即可多处使用；修改的时候只需要修改一处，多处实时更新，避免不一致。

3、调试时“自动校验”数据结构

使用 Apifox 调试接口的时候，系统会根据接口文档里的定义，自动校验返回的数据结构是否正确，无需通过肉眼识别，也无需手动写断言脚本检测，非常高效！



Apifox 自动校验数据结构


4、“可视化”设置断言

设置断言：



Apifox 设置断言


运行后，查看断言结果：



5、“可视化”设置提取变量




6、支持数据库操作




7、“零配置”Mock 出非常人性化的数据


先放一张图对比下 Apifox 和其他同类工具 零配置 mock 出来的数据效果：



Apifox Mock 数据结果对比同类工具


可以看出 Apifox 零配置 Mock 出来的数据和真实情况是非常接近的，前端开发可以直接使用，而无需再手动写 mock 规则。

• Apifox 如何做到高效率、零配置生成非常人性化的 mock 数据

• Apifox 根据接口定义里的数据结构、数据类型，自动生成 mock 规则。

• Apifox 内置智能 mock 规则库，根据字段名、字段数据类型，智能优化自动生成的 mock 规则。如：名称包含字符串image的string类型字段，自动 mock 出一个图片地址 URL；包含字符串time的string类型字段，自动 mock 出一个时间字符串；包含字符串city的string类型字段，自动 mock 出一个城市名。

• Apifox 根据内置规则，可自动识别出图片、头像、用户名、手机号、网址、日期、时间、时间戳、邮箱、省份、城市、地址、IP 等字段，从而 Mock 出非常人性化的数据。

  除了内置 mock 规则，用户还可以自定义规则库，满足各种个性化需求。支持使用 正则表达式、通配符 来匹配字段名自定义 mock 规则。

8、生成在线接口文档

Apifox 项目可“在线分享” API 文档，分享出去的 API 文档可设置为公开或需要密码访问，非常方便与外部团队协作。

体验地址：接口文档在线分享 - Apipark



9、代码自动生成


根据接口模型定义，自动生成各种语言/框架（如 TypeScript、Java、Go、Swift、ObjectiveC、Kotlin、Dart、C++、C#、Rust 等）的业务代码（如 Model、Controller、单元测试代码等）和接口请求代码。目前 Apifox 支持 130 种语言及框架的代码自动生成。

更重要的是：你可以通过自定义代码模板来生成符合自己团队的架构规范的代码，满足各种个性化的需求。

10、导入、导出

• 支持导出 OpenApi (Swagger)、Markdown、Html 等数据格式，因为可以导出OpenApi格式数据，所以你可以利用 OpenApi (Swagger) 丰富的生态工具完成各种接口相关的事情。

• 支持导入 OpenApi (Swagger)、Postman、HAR、RAML、RAP2、YApi、Eolinker、NEI、DOClever、ApiPost 、Apizza 、ShowDoc、API Blueprint、I/O Docs、WADL、Google Discovery等数据格式，方便旧项目迁。