支持接口模拟

[xw]

接口模拟几乎已经成为每个前端的必备技能。可否集成一下？推荐 mockm ：

npm i mockm -D
npx mockm --template 

功能: 点击查看

• 支持 0 侵入, 无需修改项目中的任何代码即可投入使用
• 快速生成接口和数据, 以及文档
• 支持 Restful API
• 以最方便的形式支持 api 拦截, 注入, 请求及响应修改
• 修改实时生效
• 支持自动允许跨域
• 自动带参调试, 无需登录
• 自动根据接口查找文档和调试地址, 标识字段描述
• 请求记录, 重放
• 当提供接口的后端服务出现问题, 也可最大程度还原接口响应
• 参数预校验, 助你分析接口联调的问题所在
• 无需数据库支持
• 根据接口生成业务代码
• 跨平台, 支持 linux macos windows
• 支持远程调试, 一个属性完成内网穿透

示例: 点击查看

/**
 * @see: https://www.hongqiye.com/doc/mockm/config/option.html
 * @type {import('mockm/@types/config').Config}
 */
module.exports = util => {
  return  {
    // 代理后端的接口, 如果没有可以不填
    proxy: {
      // 根结点
      '/': `https://httpbin.org/`,
      
      // 接口转发
      '/get': `https://www.httpbin.org/ip`,
      
      // 修改响应体中的 json
      '/anything/mid': [`headers.Host`, `xxxxxx`],

      // 使用函数修改响应体
      '/anything/proxy/fn':[({req, json}) => {
        return (json.method + req.method).toLowerCase() // getget
      }],
    },

    // 自己编写的接口
    api: {
      // 当为基本数据类型时, 直接返回数据, 这个接口返回 {"msg":"ok"}
      '/api/1': {msg: `ok`},

      // 也可以像 express 一样返回数据
      '/api/2' (req, res) {
        res.send({msg: `ok`})
      },

      // 一个只能使用 post 方法访问的接口
      'post /api/3': {msg: `ok`},

      // 一个 websocket 接口, 会发送收到的消息
      'ws /api/4' (ws, req) {
        ws.on(`message`, (msg) => ws.send(msg))
      },

      // 一个下载文件的接口
      '/file' (req, res) {
        res.download(__filename)
      },

      // 获取动态的接口路径的参数 code
      '/status/:code' (req, res) {
        res.json({statusCode: req.params.code})
      },
    },
    
    // 自动生成 Restful API
    db: {
      'users': util.libObj.mockjs.mock({
        'data|15-23': [ // 随机生成 15 至 23 条数据
          {
            'id|+1': 1, // id 从 1 开始自增
            name: `@cname`, // 随机生成中文名字
            'sex|1': [`男`, `女`, `保密`], // 性别从这三个选项中随机选择一个
          },
        ]
      }).data,
    },
  }
}