使用JSONSERVER模拟服务器API

前言：

一般前后端交互，前端需要后台提供数据接口才能完成整个页面的交互，那对于想动手写写自己的项目的纯前端们，那又该怎么办呢？

好在有一款可以支持搭建本地服务器的工具JSONSERVER的存在，它的用法简单记录如下：

1.获取地址：https://github.com/typicode/json-server

2.如何搭建？

（1）在windows系统下全局安装jsonserver: npm/cnpm/tnpm install -g json-server

(2) 在所在的项目文件夹下，创建一个新的文件留待创建项目jsonserver时使用，例如，我在我的项目vue-customer下，创建了一个JSONSERVER的文件夹，

cd 进入JSONSERVER文件夹，在该文件夹下初始化一个package.json文件，留待安装局部使用jsonserver，在该文件夹下，输入： npm init

这时可以看到一个package.json 文件

注意：需要修改package.json中的启动文件，按照个人意愿可以修改启动命令，例如我修改为"json:server",之后运行命令时可以输入： "npm run json:server"：

 

开始安装局部的json-server,继续输入： npm install --save json-server

 

3.准备测试json数据：例如 db.json

注意json中数据的书写格式：

 

4.测试是否搭建成功？

启动db.json文件，输入 npm run json:server，如果可以看到下面的界面，就表示本地的服务搭建成功：

试在浏览器中访问，也是成功的：