15.Macbook 上搭建 json-server

场景

想在Macbook 上搭建 json-server，记录一下流程

步骤

1.安装json-server

打开终端，输入: sudo npm install -g json-server

执行一段时间后，当看到下图所示，表示成功安装json-server。

成功安装json-server

---

提示⚠️：检查是否已安装npm。

在Mac的终端中输入：

npm -v 

如果没有安装，请移步到:下载node.js并安装。

---

2.选一个文件目录新建json文件，比如smartPhones.json

{
  "smartPhones": [
    {
      "id": 1,
      "desc": "smartisan T1",
      "completed": false
    },
    {
      "id": 2,
      "desc": "smartisan T2",
      "completed": false
    },
    {
      "id": 3,
      "desc": "smartisan R1",
      "completed": false
    },
    {
      "id": 3,
      "desc": "HUAWEI MATE20 5G",
      "completed": false
    }
  ]
}

3.启动json-server服务

在新建的json文件目录下，运行命令：json-server + 文件名
json-server smartPhones.json
特别提示⚠️：一定要在json文件所在的目录下运行指令。否则，会报：

  Oops, cars.json doesn't seem to exist
  Creating cars.json with some default data

json-server smartPhones.json

特别提示2：如果提示端口号3000不可用，则，可以按照提示修改端口号。

Cannot bind to the port 3000. Please specify another port number either through --port argument or through the json-server.json configuration file

下面是改成了20000.你可以自己指定，但通常要大一些10000+ ，防止和电脑中现有端口冲突。

json-server smartPhones.json --port 20000

看到以下提示，表示启动json-server服务成功：

  \{^_^}/ hi!

  Loading smartPhones.json
  Done

  Resources
  http://localhost:20000/smartPhones

  Home
  http://localhost:20000

浏览器中输入地址http://localhost:20000/smartPhones就能看到输出smartPhones.json的内容

json文件可以访问

至此，就搭建了一个简单的本地测试服务器，json-server支持get、post等，基本足够开发测试用了，具体的可以参考json-server官网

为了将localhost:3000/todos这样的接口改成www.test.com/todos这样的形式，就需要用nginx进行反向代理

步骤4: nginx反向代理配置