使用Json-server搭建mock服务器

Json-server项目是一个开源的REST API服务器。使用者通过json定义好数据，就可以自动生成相关的API接口，并提供了很多自定义选项。

https://github.com/typicode/json-server

1.安装

yarn global add json-server

2. 使用示例

1). 创建一个db.json文件

例如

{
  "posts": [
    { "id": 1, "title": "json-server", "author": "typicode" },
    { "id": 2, "title": "json-server 2", "author": "typicode 2" },
    { "id": 3, "title": "json-server 3", "author": "typicode 3" }
  ],
  "comments": [
    { "id": 1, "body": "some comment", "postId": 1 }
  ],
  "profile": { "name": "typicode" }
}

2). 运行 json-server

json-server -p 3088 --watch db.json

3). 默认首页

通过浏览器访问:http://localhost:3088，可以查看默认首页。

4). 测试接口

json-server根据db.json自动生成以下接口：

  http://localhost:3088/posts
  http://localhost:3088/comments
  http://localhost:3088/profile

测试

• 查看所有posts

curl http://localhost:3088/posts
[
  {
    "id": 1,
    "title": "json-server",
    "author": "typicode"
  }
]

• 查询id=3的post

 curl http://localhost:3088/posts/3
{
  "id": 3,
  "title": "json-server 3",
  "author": "typicode 3"
}

3. 更多用途

1). 命令行参数

json-server help
json-server [options] <source>

选项：
  -c, --config                   Path to config file[默认值: "json-server.json"]
  -p, --port                     Set port                         [默认值: 3000]
  -H, --host                     Set host                  [默认值: "localhost"]
  -w, --watch                    Watch file(s)                            [布尔]
  -r, --routes                   Path to routes file
  -m, --middlewares              Paths to middleware files                [数组]
  -s, --static                   Set static files directory
      --read-only, --ro          Allow only GET requests                  [布尔]
      --no-cors, --nc            Disable Cross-Origin Resource Sharing    [布尔]
      --no-gzip, --ng            Disable GZIP Content-Encoding            [布尔]
  -S, --snapshots                Set snapshots directory           [默认值: "."]
  -d, --delay                    Add delay to responses (ms)
  -i, --id                       Set database id property (e.g. _id)
                                                                  [默认值: "id"]
      --foreignKeySuffix, --fks  Set foreign key suffix (e.g. _id as in post_id)
                                                                  [默认值: "Id"]
  -q, --quiet                    Suppress log messages from output        [布尔]
  -h, --help                     显示帮助信息                             [布尔]
  -v, --version                  显示版本号                               [布尔]

示例：
  json-server db.json
  json-server file.js
  json-server http://example.com/db.json

2). 充当web服务器

如果json-server命令执行的目录下有public文件夹，则该文件夹自动成为json-server的html root文件夹。

也可以通过--static指定其他的html文件夹。

注意

如果存在public文件夹，或者指定了static目录，不论是不是有index.html，都会替换json-server自动生成的首页。

3). 指定端口

--port <端口>

4). 开启跨域访问

--no-cors关闭CORS

5). 程序生成数据

输入的数据不仅可以是json文件，还可以是js文件，并实现通过编程生成数据。

例如，以下示范如何通过代码生成1000条用户数据

module.exports = () => {
  const data = { users: [] }
  // Create 1000 users
  for (let i = 0; i < 1000; i++) {
    data.users.push({ id: i, name: `user${i}` })
  }
  return data
}

注意

js数据文件只在启动的时候被加载，所以数据在json-server启动后，是固定不变的。

与json文件不同，即使添加了--watch也不会重新被加载。

6). 自定义路由

添加routes.json文件，可以自定义路由。

例如

{
  "/api/*": "/$1",
  "/:resource/:id/show": "/:resource/:id",
  "/posts/:category": "/posts?category=:category",
  "/articles\\?id=:id": "/posts/:id"
}

4. https?

json-server默认无法配置ssl，但是可以使用typicode的另一个项目hotel来实现。

https://github.com/typicode/hotel