用node.js和mock.js实现mock数据

2019-07-19 18:35:13 浏览数 (1)

这两年,我没等你,也没随便……

---second year

各位宝宝们,好久不见了,最近我没有安排好时间,so,把自己都给了工作,需要好好学习怎么管理时间~

来到新的公司,除了想念老朋友之外,还会想念曾经的各种好用的工具,其中就有mock数据的工具,这边没有那个工具。so ,自己搭了一个mock工具,小儿科的。

speak is cheap ! show my code!

一. 原理是什么?

使用express.js创建一个服务,根据业务需要,创建响应请求的监听,使用mock.js创建假数据,返回给请求。

二. 用到了什么?

  1. mock.js
  2. express.js

三. 目录结构?

四. 具体怎么做?

1. index.js

代码语言:javascript复制
let express = require('express');    //引入express模块
let Mock = require('mockjs');        //引入mock模块
let app = express();  //创建一个服务
var test1=require("./detail/test1.js");  //引入具体test的配置
var test2=require("./detail/test2.js");  //引入具体test的配置
// 为每个具体的配置创建监听
var dataArr = [test1,test2]; 
for(let i=0;i<dataArr.length;i  ){
    let item = dataArr[i];
    app.all(item.router, function(req, res) {
        res.json(item.data);
    });
}
/*为app添加中间件处理跨域请求*/
app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header('Access-Control-Allow-Headers', 'Content-Type');
    next();
});
//监听3000端口
app.listen('3000');

2. test1.js

代码语言:javascript复制
let Mock = require('mockjs');        //引入mock模块
var test1 = {
    router : '/test1.action',  // 配置监听的路径
    data : Mock.mock({
        "status": 200,   // 设置返回status 
        "data|1-9": [{   // 设置返回status 
            "id| 1": 1,
            "value|0-500": 20
        }]
    })

}
module.exports= test1;   // 导出test1

返回数据的具体语法,可查看mock.js官方文档: http://mockjs.com/。

3. package.json增加一句:"start": "node index.js"

代码语言:javascript复制
{
  "name": "mock-demo",
  "version": "1.0.0",
  "description": "mock.js demo",
  "main": "index.js",
  "scripts": {
    "test": "echo "Error: no test specified" && exit 1",
    "start": "node index.js"
  },
  "keywords": [
    "mockjsdemo"
  ],
  "author": "Lin",
  "license": "ISC",
  "dependencies": {
    "express": "^4.17.1",
    "mockjs": "^1.0.1-beta3",
    "request": "^2.88.0"
  }
}

4. 在项目根目录下执行 npm start ;

5. 在浏览器访问:http://localhost:3000/test2.action,如下图:

so ,现在,我们开发的时候就不用造假数据了。也不用等着联调,我们就能调接口了。

愿我们有能力不向生活缴械投降---Lin

0 人点赞