json-server使用与postman

Posted 2021-07-17 安之ccy

json-server:Get a full fake REST API_官方教程

json-server安装与基础配置

1.先全局安装json-server：npm install -g json-server

2.新建一个文件夹，命名JSONSERVER，cd到这个目录下，初始化package.json文件：
在命令行输入：npm init，回答里面的问题，
可以一路回车（相当于直接在命令行输入npm init --yes），此时文件夹下会有一个package.json文件

{
  "name": "JSONSERVER",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \\"Error: no test specified\\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

3.局部安装json-server：
在JSONSERVER文件夹下：npm install json-server --save
package.json文件被更新，在文档添加了以下内容：

"dependencies": {
    "json-server": "^0.16.3"
  }

4.添加命令行快捷的开启方式：
在package.json文件中的scripts添加开启json-server的命令：

"json:server": "json-server --watch db.json"

保存之后可以在命令行启动json-server：

在浏览器打开所给链接，就可以看到欢迎界面，里面会展示你配置的数据（下面会写数据的创建）

修改json-server默认端口号

可以在启动命令后加–port 3004，修改端口号为3004

"scripts": {
    "json:server": "json-server --watch db.json --port 3004"
  }

数据添加

在JSONSERVER文件夹下创建一个db.json文件，并添加数据，列举部分数据如：

{
  "users": [
    {
      "name": "ccy",
      "phone": "333-444-555",
      "email": "[e-mail]",
      "id": 1,
      "age": 31,
      "companyId": 1
    },
    {
      "name": "ccy1",
      "phone": "333-444-555",
      "email": "[e-mail]",
      "id": 2,
      "age": 32,
      "companyId": 2
    },
    {
      "name": "ccy2",
      "phone": "333-444-555",
      "email": "[e-mail]",
      "id": 3,
      "age": 43,
      "companyId": 3
    }
  ],
  "companies":[
  		{...},
  		{...},
  		{...}
  ],...
}

与postman结合使用

使用postman操作数据
1.post发送

db.json里面可以看到，已经添加了该数据：

在浏览器里输入：http://localhost:3000/users，也可以看到：

2.delete删除:按id删除，删除成功时，在结果栏会显示{}

3.patch更新：
原本数据：

{
      "name": "ccy5",
      "phone": "333-444-555",
      "email": "[e-mail]",
      "id": 5,
      "age": 43,
      "companyId": 3
    }

修改name为anzhi：

结果：

对数据的修改都可以在命令行里看到：
上面列举的三个操作分别是：