json-server实现mock数据(一)

1.安装

npm install json-server --save-dev

2.应用

2-1.新建一个文件db.json(用来写返回接口数据)

// db.json
	{
		news: {
			“a”: 1
		}
	}

2-2.新建server.js文件

	// server.js
                 const jsonServer = require('json-server')
		const server = jsonServer.create()
		// 根据db.json文件自动生成路由规则
		const router = jsonServer.router('db.json')
		const middlewares = jsonServer.defaults()
		const dbs = require(‘./mock/postdb.js’)

		server.use(middlewares)
		server.get("/getdata",function(req,res){
    			res.send(dbs.getData);
		});
		server.post(“/postdata",function(req,res){
    			res.send(dbs.postData);
		});
		server.use(router)
		server.listen(9999, () => {
  			console.log('JSON Server is running at port 9999’)
		})

tip: 除此之外,我们还可以在新建一个postdb.js文件, 用来自定义返回的接口数据,
然后通过server.get(‘地址’, function() { …… })
或者server.post(‘地址’, function() { …… })
eg:

```
	module.exports = { 
	getSide: {
   			 status: 0,
   			 data: 10,
   			 result: [{
      		  code: 1,
        		  name: 'hello'
   			 }]
		}
}
	```
    通过访问: http:localhost:9999/api/getSide, 即可获取到数据。

json-server实现mock数据(一)_第1张图片

3.启动

node server.js

4.效果

用postman进行测试:
4-1. 获取news数据:
json-server实现mock数据(一)_第2张图片

4-2. 获取news数据中id为2的数据:

json-server实现mock数据(一)_第3张图片

4-3. 如果要对数据进行追加操作, 可以用post请求; eg:
json-server实现mock数据(一)_第4张图片

发送请求成功后, 再来看news的数据:

json-server实现mock数据(一)_第5张图片

如果需要修改数据, 可以用put:

json-server实现mock数据(一)_第6张图片

此时数据就被更改了:

json-server实现mock数据(一)_第7张图片

同理,delete模拟删除, 此处不再演示

参考文档: https://github.com/typicode/json-server

你可能感兴趣的:(javascript)