一个模拟服务端api的工具, 支持 https、触发鉴权、模拟接口、模拟请求错误、转发请求、异步操作 等功能
# 用于构建mock服务器 npm run bundle # webpack 插件模式 npm run build # 打包并运行mock服务器 npm run mock 下载
git clone https://github.com/kscript/mock.git 安装
npm i 运行
npm run mock 项目运行后, 打开首页(http://localhost:3030) 可查看demo
- 安装
npm i ks-mock -D - 添加 mock 文件夹, 参照如下示例, 添加入口文件 index.js 和处理用于处理返回数据的文件 datas.js
// index.jsconstKsMock=require("ks-mock");constdatas=require('./datas.js');newKsMock({mockData: datas,headConfig: null,crossDomain: true,port: 3030,loginUrl: 'login',https: {key: '',cert: ''}}).server();// datas.jsmodule.exports={login: {format: (method,params,result,{ body })=>{Object.assign(result.data,params);// 同步returnresult// 异步returnnewPromise((resolve,reject)=>{setTimeout(()=>{// reject(result)resolve(result)},1e4)})},post: {data: {},message: "登录成功!"}},};- 在 package.json 添加命令
"mock": "node mock" 安装
npm i ks-mock -D 使用
// webpack.config.jsconstpath=require('path');constKsMock=require("ks-mock");module.exports={ ... plugins: [newKsMock({// // 静态文件目录// static: path.join(__dirname, 'upload'),// 上传文件/写入文件前的钩子// beforeUpload(req, file, done){// // 参数: 错误对象, 要存储的目录// done(null, '')// },// beforeWrite(req, file, done){// // 参数: 错误对象, 要存储的文件名// done(null, '')// },mockData: {},headConfig: null,crossDomain: true,port: 3030,// // 配置路由重写规则// rules:{// '/api/*': '/api?name=$1'// },// // 配置https证书// https:{// key: '',// cert: ''// }})...]}|- public demo文件夹
|- src 源码文件夹
|- -- auth.ts 用户权限
|- -- config.ts mock服务器的一些配置
|- -- datas.ts 返回数据
|- -- index.ts 插件模式入口
|- -- localhost.ts mock服务器模式入口
|- -- rules.ts 路由重写规则
|- -- server.ts mock服务器实例
|- -- utils.ts 一些用到的方法
|- ssl SSL证书
|- db.json json-server数据库(在其它项目中使用时, 会在process.cwd()目录生成)
|- index.js rollup打包后的插件入口
|- localhost.js rollup打包后的 mock服务器 入口
|- package.json
|- rollup.config.js rollup配置
string | ((jsonServer: Object, server: Object) => void)
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| mockData | object | {} | 模拟属性相关的配置 |
| headConfig | object | null | 服务器请求头设置 |
| crossDomain | boolean | true | 是否允许跨域 当 headConfig 不为空时, 忽略该项 |
| port | number | 3030 | 端口号 |
| static | object/function | __dirname + '/public' | 静态文件目录 |
| beforeUpload | function | undefined | 上传文件前的钩子 |
| beforeWrite | function | undefined | 写入文件前的钩子 |
| https | object/undefined | undefined | https配置 |
| rules | object | - | 路由重写规则, 参考 json-server rewriter |
| loginUrl | string | - | 登录地址, 如果配置了loginUrl, 那么除登录和public属性为true的接口外, 其它接口必须在登录之后才可以正常执行 |
| logoutUrl | string | - | 退出登录地址 |
| interceptor | function | - | 拦截器, 用于拦截/修改发送的请求 |
mockData 属性, 存放客户端请求api时的返回数据, 以及对返回数据的一些操作
支持的可选操作有:
- 对返回数据的包装
- 返回错误信息
- 转发请求
返回数据支持 mock.js 中的写法, 查看 mock.js 使用文档, 但如果是被 鉴权/错误处理/转发请求 拦截, 那么 mock.js 写法无效
{// 请求地址url: {// 默认除登录外的接口都需要鉴权, 但设置了public, 则表示当前接口不需要鉴权public: true,/** * 对模拟返回的数据进行包装 * @func * @param{string} method 请求方法 * @param{object} params 请求参数 * @param{any} result 默认返回结果的副本 * @desc 无返回值时, 则放弃修改 */format: (method,params,result)=>{},/** * 对模拟返回的数据进行包装 * @func * @param{string} method 请求方法 * @param{object} params 请求参数 * @param{any} result 默认返回结果的副本 * @desc 返回值说明: * 1. function(res, headConfig) - 通过方法来自定义报错信息 * 2. object - 作为报错信息 * 3. string - 作为报错信息内容 (使用默认的报错结构) * 4. 其它 - 没有错误, 继续向下执行~ */error: (method,params,result)=>{// 1returnfunction(res,headConfig){res.writeHead(400,headConfig)res.end(JSON.stringify({code: 400,message: '未知错误'}))}// 2return{code: 400,message: '未知错误'}// 3return'未知错误'},/** * 转发请求 * @func * @param{string} method 请求方法 * @param{object} params 请求参数 * @param{any} result 默认返回结果的副本 * @desc relay 可以是一个url字符串 * @returns string/object/array */relay: (method,params,result)=>{leturl=''// 返回值用于给 request 模块传参, 调用逻辑:// request.apply(request, Array.isArray(returns) ? returns : [returns])// request中的传参字段: get为qs, post为formreturnurl// return{// url,// [/post/i.test(method) ? 'form' : 'qs']:{// test: 123// }// }// return [url,{// [/post/i.test(method) ? 'form' : 'qs']:{// test: 123// }// }]},// 请求方法, 返回数据// 返回数据可以使用 mockjs 来填充数据, 也可以直接写json// 请求方法为函数时, 参数与format/error/ralay等方法一致, 但result为空对象, 返回值作为返回数据// get: (method, params, result) =>{}get: {// ...},// 如果在 db.json 中配置了当前url, 则post请求会被 json-server 拦截// 请求被拦截的优先级: 鉴权 > 错误处理error > 转发请求relay > json-serverpost: {// ...},}}
MIT