使用json-server和postman模拟搭建服务端环境

很多都东西都要有第一次尝试才会有收获,例如前端可以创建json文件编写模拟接口,利用json-server去模拟搭建一个本地服务端环境去监听和操作自己创建的json数据,进而通过请求本地服务端接口进行数据的展示,也可以对数据进行增删改查。这对以后和后端开发工程师配合制定接口规范多多少少都有一点帮助吧。废话不多说,直接丢操作:

1.首先你要安装最新版本的Node.js
2.打开cmd

1)(全局安装json-server):npm install -g json-server
2) cd 你的文件目录
3)初始化:npm init
4)初始化安装完成之后根据提示输入信息之后在你的目录中会有一个package.json的文件
使用json-server和postman模拟搭建服务端环境
文章图片



5).安装json-server依赖模块到package.json文件中,输入指令:npm install json-server --save
6).在你的文件目录下创建json文件(比如:db.json)并编写json数据;
7).修改package.json的启动方式,打开package.json文件修改"test": "echo \"Error: no test specified\" && exit 1"为:
"json:server":"json-server --watch db.json"(左侧json:server为自定义启动名称,右侧为执行事件)
8).回到cmd终端输入指令:npm run json:server
运行结果如图(http://localhost:3000/users就是我的本地接口,users是我在db.json中写的接口对象,这个可以根据自己的需求来写):
使用json-server和postman模拟搭建服务端环境
文章图片


最后你可以通过数据请求的方式进行数据展示了,当然你也可以对数据进行CRUD。
3.postman的配合篇
1).下载安装postman工具
2).填写对应的信息如图所示:
首先关联你的本地接口地址,选择你要对接口进行的事件是什么(比如post/get/put/delete……)
使用json-server和postman模拟搭建服务端环境
文章图片


然后选择Headers菜单将key设置为Content-Type,value设置为application/json

使用json-server和postman模拟搭建服务端环境
文章图片


进而选择Body菜单编写json数据,完成之后点击send按钮提交(这里演示post事件),在下方的Response板块就会返回你的提交结果,然后刷新浏览器打开的本地接口地址就会发现你已经将此次的数据post到你的json数据中
使用json-server和postman模拟搭建服务端环境
文章图片


使用json-server和postman模拟搭建服务端环境
文章图片


【使用json-server和postman模拟搭建服务端环境】


    推荐阅读