@mi/hulk

Hulk => 无敌浩克：提供 mock 数据服务的 express 中间件

| Question | Answers | | :--- | :--- | | Mock 是什么？ | mock 就是在开发过程中，由于一些原因，需要模拟网络请求(大多为 REST API)并拿到数据，正常开发的方法。 | | Hulk 是什么？ | Hulk 是一个可插拔的 express 中间件，如果你使用了 Hulk，它可以提供 mock 服务(拦截请求，填充数据，返回结果)。| | Hulk 是如何做到的？ | Hulk 依赖于 webpack-dev-server ，在数据请求的中间层做匹配和拦截，符合条件的请求会做 mock 处理 | | 为什么要用 Mockjs？ | Mockjs 是目前看来业界比较成熟的提供 mock 数据的库，我们用它来提供更加真实的 mock 数据，比如数组、对象、地名、ip、人名、复杂的 json 结构等等。 | | 我要怎么使用它们？ | 请参阅下方文档。 |

Install

$ nrm use mi
$ npm install @mi/hulk mockjs --save-dev

Usage

你需要在你的 webpack 配置文件暴露 express实例: app 的位置做如下例所示修改，其中：

• bodyParser 和 multer 是用来解析 post 参数的中间件
• HulkMiddleWare 是提供 mock 代理服务的中间件：Hulk

const bodyParser = require('body-parser');
const multer = require('multer');
const HulkMiddleWare = require('@mi/hulk');

// ...

setup(app) {
  app.use(bodyParser.json());
  // for parsing application/json
  app.use(bodyParser.urlencoded({ extended: true }));
  // for parsing application/x-www-form-urlencoded
  app.use(multer());
  // for parsing multipart/form-data

  app.use(HulkMiddleWare);
  // use Hulk Middle Ware
}

/** `./.hulkrc.js`
 * 默认会读取项目根目录下的 .hulkrc.js 为配置项
 * 如需自定义配置请在项目根目录 `package.json` 中配置 `hulkpath` 字段
 */

const Mock = require('mockjs');
// 这里引入 mockjs 提供更真实的数据模拟服务
// 这是我们推荐的，但您可以根据习惯自由选择

module.exports = {
  Options: {},
  Rules: [{
    url: /\/Jeason/,
    method: 'get',
    resCode: 200,
    resHeaders: {
      'Content-Type': 'application/json',
    },
    res: ({ name, year }) => Mock.mock({
      'stars|3': '★',
      'name': name,
      'year': year,
    }),
  }],
};

Module.exports Schema

| key | type | value | | --- | --- | --- | | Options | Object | 留作扩展(swagger) | | Rules | Array | Rule 数组 |

Rules Schema

| key | type | value | | --- | --- | --- | | url | RegExp, String, Function | 我们推荐正则形式，但也支持字符串和函数，如果为函数类型，其参数为 (reqPath)，返回值必须为布尔值 | | method | String | 匹配 req.method，不填代表匹配全部 | | resCode | Number | 期望返回的 statusCode，默认为 200 | | resHeaders | Object | 期望返回的 response Headers，不填返回默认值 | | res | Function | 参数为 get/post 请求的参数对象，可以通过解构方式获取(见上)，返回值为期望返回的数据 | | invade | Function | 自定义方法字段，若 typeof invade === 'function'，Hulk 会忽略 resCode,resHeaders,res 三个字段，并暴露一个回调函数 invade(req, res, next) |

如上配置，请求 GET /Jeason?name=jeason&year=20 我们可以得到一个 json 对象，其内容为：

{
  "stars": "★★★",
  "name": "jeason",
  "year": 20,
}

NOTE: important!!

一些声明：

• Hulk 只提供中间件代理服务，模拟生成数据服务 我们推荐使用 mockjs ，但你可以有其他类似的选择。
• 若 url 字段无请求匹配，则 Hulk 会不作处理，忽略此请求
• 若多个正则(或字符串或函数)匹配成功，则按最先匹配的结果处理

关于 MockJS

• Mock.mock() 数据规范及wiki
• 下面列出了几个例子，更多请参考 examples

Mock.mock(template) example：

Mock.mock({
  'foo': 'Syntax Demo',
  'name': function() {
    return this.foo
  }
})
// =>
{
  "foo": "Syntax Demo",
  "name": "Syntax Demo"
}

Mock.mock({
  "number|123.10": 1.123
})
// =>
{
  "number": 123.1237379745
}

Mock.mock({
    'regexp1': /[a-z][A-Z][0-9]/,
    'regexp2': /\w\W\s\S\d\D/,
    'regexp3': /\d{5,10}/
})
// =>
{
    "regexp1": "pJ7",
    "regexp2": "F)\fp1G",
    "regexp3": "561659409"
}

Mock.mock({
    name: {
        first: '@FIRST',
        middle: '@FIRST',
        last: '@LAST',
        full: '@first @middle @last'
    }
})
// =>
{
    "name": {
        "first": "Charles",
        "middle": "Brenda",
        "last": "Lopez",
        "full": "Charles Brenda Lopez"
    }
}

Devlope

请 clone 原仓库：git clone [email protected]:Jeason/hulk.git

// 开发
$ nrm use mi
$ cd Hulk && npm install
$ cd .. && npm install
$ npm start
// 如果使用 vscode 开发可以直接 F5，支持调试。

// 测试
$ npm run test:simple
// 不生成覆盖率报告
$ npm run test:server
// 只测试 server
$ npm run test
// 生成测试覆盖率报告