json-server 模拟假数据进行前后端交互

最近遇到了需要使用假数据来填充系统的情况 看了一眼json-serve 发现用很方便
只需要一个json文件就可以随意操作 跟大家分享一下

使用前环境 安装好node环境

第一步
全局安装json-server npm install -g json-server
想要查看安装是否成功 json-server -v
安装
第二步
在任意文件夹下创建一个json文件
这里我是在桌面上创建了一个 名为 test.json的文件
粘入以下json格式的代码

{
  "scoreList":[
    {"id":1,"userName":"张三","age":12,"sex":"男","score":{"yuWen":10,"shuXue":20,"yingYu":30}},
    {"id":2,"userName":"李四","age":21,"sex":"女","score":{"yuWen":12,"shuXue":45,"yingYu":37}},
    {"id":3,"userName":"王五","age":56,"sex":"男","score":{"yuWen":12,"shuXue":20,"yingYu":30}},
    {"id":4,"userName":"赵六","age":23,"sex":"女","score":{"yuWen":19,"shuXue":21,"yingYu":65}},
    {"id":5,"userName":"严七","age":12,"sex":"男","score":{"yuWen":34,"shuXue":67,"yingYu":43}},
    {"id":6,"userName":"沈八","age":43,"sex":"女","score":{"yuWen":56,"shuXue":76,"yingYu":30}},
    {"id":7,"userName":"钱九","age":13,"sex":"男","score":{"yuWen":24,"shuXue":89,"yingYu":30}},
    {"id":8,"userName":"张十","age":12,"sex":"女","score":{"yuWen":10,"shuXue":54,"yingYu":31}}
  ]
}

第三步
进行json文件的监听
json-server --watch test.json
后面可以用来指定端口号

出现地址后证明咱们的数据模拟服务就启动成功了

第四步
在浏览器的地址栏进行访问即可看到自己启用的数据服务
http://localhost:3004/coming 具体看自己生成的地址即可

第五步
这个地址就和后端的接口地址一样了 可以使用ajax或者axios等技术进行数据请求了

好了 今天的分享就这些了 欢迎大家一起交流学习