使用 JSON Server 在本地进行开发

JSON Server 是一种快速的方法，可为前端开发人员提供 API 平台。您可以在本地运行 JSON Server，并在其中存储并处理数据。这些数据不需要与后端服务器通信。我们可以使用 JSON Server 模拟后端服务器，以便在本地进行开发。

使用 JSON Server 的优点

JSON Server 提供了以下优点:

• 您可以在本地运行 JSON Server，而无需依赖Internet连接。
• 您可以模拟 API 的不同状态 - 成功，失败，挂起，等等。这种能力很难在开发时进行测试。
• JSON Server 提供了最少的上下文。因此，您可以只关注数据，而无需考虑其他服务器细节。
• JSON Server 可以与任何前端框架一起使用(React.js，Angular.js，Vue.js 等)。

安装 JSON Server

您可以使用 npm 安装 JSON Server。

npm install -g json-server

启用 JSON Server

使用标准 db.json 文件启动 JSON Server：

json-server --watch db.json

--watch 标记表示，如果在数据文件变化时， 监听器应接收通知并更新数据，然后重新启动。

修改 JSON Server

如果您需要进一步修改 JSON 数据，则需要打开 db.json 文件进行修改。在这个文件中，您可以添加或删除数据集并修改数据。

// db.json

{
  "users": [
    { "id": 1, "name": "John Snow", "email":"john.snow@example.com", "age": 30 },
    { "id": 2, "name": "Daenerys Targaryen", "email":"targaryen.daenerys@example.com", "age": 22 }
  ],
  "posts": [
    { "id": 1, "title": "JSON Server is Awesome", "authorId": 1 },
    { "id": 2, "title": "Learn JavaScript", "authorId": 1 },
    { "id": 3, "title": "Introduction to React", "authorId": 2 }
  ]
}

在这个例子中，我们有两个数据集：一个是用户数据集，另一个是帖子数据集。每个数据集都有一个特定的键，该键作为数据集的名称，在离线期间，可以使用该名称访问数据。

访问 JSON Server 数据

当您启动 JSON Server 后，可以通过使用以下 URL 访问数据：

• http://localhost:3000/users
• http://localhost:3000/posts

如果您希望使用其他本地 IP 地址运行，则可以在配置文件中使用以下值启动 JSON Server。

// db.json

{
  "host": "0.0.0.0",
  "port": 3000,
  "route": "/api",
  "endpoints": {
    "/api/users": {
      "method": "GET",
      "response": []
    }
  }
}

以上标题所示，分别为：

• 安装 JSON Server
• 启动 JSON Server
• 修改 JSON Server
• 访问 JSON Server 数据

希望本篇文章对您有所帮助！