丁香园开源接口管理系统 - API Mocker

18,203 阅读3分钟

API Mocker

先贴上项目地址:DXY-F2E/api-mocker

随着web发展,前后端分离的演进,网页的交互变的越来越复杂。在项目开发过程中,前后端并行开发时,在涉及到接口的部分,总是遇到各类问题。诸如接口假数据、接口参数的约定、代理调试等等,极大的影响了开发效率。

API Mocker致力于解决前后端开发协作过程中出现的各类问题,提高开发效率,对接口做统一管理,同时也能为后续的迭代维护提供更便捷的方式。

系统功能

接口约定

API Mocker提供操作简单但功能丰富的接口编辑,接口约定者能方便的设置接口的各类信息,其中:

  • 结构化的接口参数输入与输出
    • 支持不同维度的请求参数约定(querybodypath, header
    • 支持参数的类型约定(stringnumberbooleanobjectarray
    • 参数备注、示例
  • 支持Json数据逆向生成参数结构
  • 保留一定接口历史记录

Mock数据

API Mocker认为,mock不仅仅体现在返回数据中,mock请求本身也应该符合接口约定。因此,我们提供更加符合业务场景的mock服务。

  • Mock请求会根据接口约定,自动生成假数据。
  • Mock请求会根据接口约定,对请求参数做校验。(校验是否选填、参数类型是否正确)。
  • 根据接口约定与用户设置,能模拟不同的网络响应状态,如:200404500
  • 支持接口代理,代理mock请求到线上or测试地址,避免开发环境跨域,省下Charles代理过程。
  • 支持Mock.js语法。

接口文档

API Mocker会根据接口约定自动生成简洁优美、结构清晰的接口文档。同时,可以订阅接口,当接口发生变化时,及时收到邮件通知。

接口权限

API Mocker提供简单易用的权限控制。

  • 组级别、API级别控制
  • 可见性、可写性权限控制

其他功能点

  • 接口测试。开发人员可以在系统上直接测试接口,避免在postman等请求工具上又填写众多参数
  • 便捷的接口搜索。(可以按接口地址、管理员等维度搜索接口)
  • 数据呈现
  • 支持rap的导入

技术栈与第三方库

  • ES6
  • ESLint (Standard)
  • Ramda
  • ...

Client

架构图如下:

Server

架构图如下:

其他部署相关内容可看项目github地址的介绍。

系统未来展望

更加强大的接口约定

  • 更多校验属性的添加(日期、范围、正则)
  • 更便捷的编辑
    • 模板选择
    • 组内接口字段智能提示
    • 完善restful api的支持
  • 接口状态管理、版本管理

更完善的周边功能

  • swagger导入
  • markdown格式文档导出
  • Model文件导出(TypeScript等)
  • 自动化测试
    • 随机数据
    • 多次请求
    • 生成报表

其他完善的点

  • 完善mock的体验
  • 更多维度的数据统计
  • 完善使用文档
  • 国际化

致谢

项目本身也引用了众多开源项目,在此再次感谢这些项目对社会与技术圈作出的杰出贡献。丁香园也将努力、持续的做技术输出、产品输出,为开源社区做出自己的一份力量。

Github地址     API Mocker使用文档