写点什么

mock 请求分发

用户头像
blueju
关注
发布于: 2021 年 03 月 06 日
mock 请求分发

首发于 语雀文档

背景是这样的

我们公司的后管项目走的不是 resful 风格的 api,而是走后管网关,后管网关会将请求进行分发,具体怎么分发,有这么以下几点:


  • 请求全部走 POST

  • 请求 URL 统一为 /agrs

  • 数据提交方式为 application/json

  • 数据格式大致分为:

- 系统报文头

- 服务名

- 接口名

- 接口版本号

- 系统标识

- 本地报文头

- 用户信息

- 分页信息

- 设备信息

- 报文体

- 视具体情况而变化的动态数据

  • 文件传输走 OSS,不走表单文件流

  • ......


<a name="q9uue"></a>

痛点

我们前端当然是不可能等后端开发完了才开始写代码的嘛,因此我们需要 mock,然而网关请求分发因为以上的诸多要求,使得 mock 开发十分不方便,有以下:


  1. 按传统方式创建 mock,那么请求 URL 开发的时候是一套,打包的时候又要全部改成 /agrs,这。。。

我希望的是开发时和打包时都是一样的,不需要改来改去两套标准


  1. 需要新 mock 时,按照 umi 的 mock 规范,需要在 mock 文件夹中创建一个 js 文件,并默认暴露一个对象,例如:

mock/getApps.js


export default {	"POST /getApps": {  	sysHead: {},    localHead: {},    body: {},  }}
复制代码

需要多次写重复代码和重复数据结构(sysHead,localHead),而我只想关注 body 中的 mock 数据

我们的是 umi 工程,mock 这块详见 Mock 数据


  1. 按照第 2 点,当后端接口的服务名 &接口名真正提供后,为了保持一致,我们除了要修改 mock 文件名,还需要修改 mock 文件中所暴露对象中的 URL 名称,麻烦。

  2. 要做到第 3 点,还得有个前提,就是 mock 文件名是与该 mock 所拦截的 URL 是一致的,不然那么多接口看都看不过来,找起来甚是痛苦眼瞎。

  3. 以 js 暴露模块的方式进行 mock,拦截同一 URL 的 mock 是可以被覆盖而不自知的,不清楚的人会出现明明 mock 的 URL 都正确但响应数据却对不上,这种一头雾水的情况

  4. ......


以上不方便,不是凭空想的,因为是付出了时间、人力,得出的确不方便这个结论的,光是以上第一点,就已经够受了。


解决

总体的思路就是:

只拦截 /agrs 这个 URL,使用 node.js 获取请求报文 request 中的参数服务名和接口名,按设计好的目录结构拼接路径,按路径读取文件并 JSON 格式化,最后返回。


对应以上痛点的解决措施:

  1. 开发时和打包时保持一致,都是用统一 URL:/agrs。

  2. 不使用 js 暴露模块的方式,直接使用 json 文件,其中放置重点关注的 json 格式 mock 数据,其他重复数据结构会在别处统一整合。

  3. 所设计的目录规范是:目录名称就是服务名,mock 文件名称就是接口名。(第 2 点已提及不需再定义和暴露,因此如果修改不必之前那么麻烦,只需要修改目录名称和文件名称即可)

  4. 在任何系统中,同一目录下是不能出现同名文件夹或同名文件的,按第 3 点的目录规范可解决重复覆盖问题,还能重复别人已有接口。


其他不多说了,直接上 github,也不是人人都会碰到这种情况,只是帮助内部前端小组提升开发体验的一个小工具库而已,也是作为一个前端小组长该做的事。


代码不复杂,自我感觉更重要的是,不论遇到大小问题,会去想怎么解决比较好,不断总结,不断积累吧。

Github

https://github.com/blueju/mock-request-distribute


发布于: 2021 年 03 月 06 日阅读数: 10
用户头像

blueju

关注

还未添加个人签名 2019.04.05 加入

还未添加个人简介

评论

发布
暂无评论
mock 请求分发