<返回更多

web服务器json-serve详解

2023-11-09  今日头条  web技术的分享者
加入收藏

简介

JSON-Server 是一个 Node 模块,运行 Express 服务器,你可以指定一个 json 文件作为 api 的数据源。

一、安装 JSON-Serve (Install JSON Server)

使用 npm 或 yarn 工具安装

npm install -g json-server
yarn global add json-server

文件的目录结构:

 

web服务器json-serve详解

 

 

启动 json-server

json-server可以直接把一个json文件托管成一个具备全RESTful风格的API,并支持跨域、jsonp、路由订制、数据快照保存等功能的 web 服务器。

json-serve 命令参数,习惯使用help查看命令详情
json-server --help

bin.js [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 显示版本号 [布尔]
示例:
bin.js db.json
bin.js file.js
bin.js
http://example.com/db.json

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

创建 db-api.json 文件内容如下

{
  "goods": [
    { "id": 1,  "name": "苹果",   "price": 10  },
    { "id": 2,  "name": "橘子",   "price": 15  },
    { "id": 3,  "name": "西瓜",   "price": 8   },
    { "id": 4,  "name": "橘子1",   "price": 15  },
    { "id": 5,  "name": "橘子2",   "price": 15  },
    { "id": 6,  "name": "橘子3",   "price": 15  },
    { "id": 7,  "name": "橘子4",   "price": 15  },
    { "id": 8,  "name": "橘子5",   "price": 15  },
    { "id": 9,  "name": "橘子6",   "price": 15  }
  ],
  "shoppingCart": [
    { "id": 3, "name": "西瓜",   "price": 8,   "amount": 1    },
    { "id": 2, "name": "橘子",   "price": 15,  "amount": 2    },
    { "id": 1, "name": "苹果",   "price": 10,  "amount": 2    }
  ],
  "posts": [
    { "id": 1, "title": "json-server", "author": "typicode"   }
  ],
  "comments": [
    { "id": 1,  "body": "some comment",   "postId": 1    }
  ],
  "profile": {    "name": "typicode"  },
  "getUserInfo": {
    "username": "张三",
    "accessToken": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkYXRhIjpbeyJuYW1lIjoiaGt6In0seyJwd2QiOiIxMjM0NTYifV0sImlhdCI6MTY5ODM3ODE4OCwiZXhwIjoxNzY3MTEwMzk5LCJhdWQiOiIxMjM0NTYiLCJpc3MiOiJkZWx5Iiwic3ViIjoiMTIzNDU2In0.AXQRLBr7o71C8Uv5BzvcKX5osPkFgOKJwHTGzSvTOgE",
    "refreshToken": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkYXRhIjpbeyJuYW1lIjoiaGt6In0seyJwd2QiOiIxMjM0NTYifV0sImlhdCI6MTY5ODM3ODE4OCwiZXhwIjoxNzY3MTEwMzk5LCJhdWQiOiIxMjM0NTYiLCJpc3MiOiJkZWx5Iiwic3ViIjoiMTIzNDU2In0.AXQRLBr7o71C8Uv5BzvcKX5osPkFgOKJwHTGzSvTOgE",
    "roles": ["common","admin","edit","update","select","delete" ]
  },
  "login": {
    "data":{
      "username": "张三",
      "accessToken": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkYXRhIjpbeyJuYW1lIjoiaGt6In0seyJwd2QiOiIxMjM0NTYifV0sImlhdCI6MTY5ODM3ODE4OCwiZXhwIjoxNzY3MTEwMzk5LCJhdWQiOiIxMjM0NTYiLCJpc3MiOiJkZWx5Iiwic3ViIjoiMTIzNDU2In0.AXQRLBr7o71C8Uv5BzvcKX5osPkFgOKJwHTGzSvTOgE",
      "refreshToken": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkYXRhIjpbeyJuYW1lIjoiaGt6In0seyJwd2QiOiIxMjM0NTYifV0sImlhdCI6MTY5ODM3ODE4OCwiZXhwIjoxNzY3MTEwMzk5LCJhdWQiOiIxMjM0NTYiLCJpc3MiOiJkZWx5Iiwic3ViIjoiMTIzNDU2In0.AXQRLBr7o71C8Uv5BzvcKX5osPkFgOKJwHTGzSvTOgE",
      "roles": ["common","admin","edit","update","select","delete"]
    },
    "code":0,
    "status":0,
    "message":"成功"
  },
  "token": {
    "header": { "alg": "HS256", "typ": "JWT"    },
    "payload": {
      "data":  { "name": "张三" , "pwd": "123456" },
      "iat": 1698378188,
      "exp": 1767110399,
      "aud": "123456",
      "iss": "zhangshan",
      "sub": "123456"
    }
  }
}

运行 json-server

 json-server --watch db-api.json
 json-server --watch db-api.json --port 8080
 # 创建配置文件 config.json,内容如下:
    {
        "port": 8989,
        "watch": true,
        "read-only": false,
        "no-cors": false,
        "no-gzip": false
    }
 # 指定配置文件
json-server --ro --watch -c config.json db-api.json

{_}/ hi!
Loading db-api.json
Done

Resources
http://localhost:3000/goods
http://localhost:3000/shoppingCart
http://localhost:3000/posts
http://localhost:3000/comments
http://localhost:3000/profile
http://localhost:3000/getUserInfo
http://localhost:3000/login
http://localhost:3000/token

Home
http://localhost:3000

Type s + enter at any time to create a snapshot of the database
Watching...

打开浏览器,输入: http://localhost:3000/ 显示效果

 

web服务器json-serve详解

 

全部查询

点击 /login object

http://localhost:3000/login

{
    "data": {
        "username": "张三",
        "accessToken": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkYXRhIjpbeyJuYW1lIjoiaGt6In0seyJwd2QiOiIxMjM0NTYifV0sImlhdCI6MTY5ODM3ODE4OCwiZXhwIjoxNzY3MTEwMzk5LCJhdWQiOiIxMjM0NTYiLCJpc3MiOiJkZWx5Iiwic3ViIjoiMTIzNDU2In0.AXQRLBr7o71C8Uv5BzvcKX5osPkFgOKJwHTGzSvTOgE",
        "refreshToken": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkYXRhIjpbeyJuYW1lIjoiaGt6In0seyJwd2QiOiIxMjM0NTYifV0sImlhdCI6MTY5ODM3ODE4OCwiZXhwIjoxNzY3MTEwMzk5LCJhdWQiOiIxMjM0NTYiLCJpc3MiOiJkZWx5Iiwic3ViIjoiMTIzNDU2In0.AXQRLBr7o71C8Uv5BzvcKX5osPkFgOKJwHTGzSvTOgE",
        "roles": [
            "common",
            "admin",
            "edit",
            "update",
            "select",
            "delete"
        ]
    },
    "code": 0,
    "status": 0,
    "message": "成功"
}

条件查询

http://localhost:3000/goods

[
    {
        "id": 1,
        "name": "苹果",
        "price": 10
    },
    {
        "id": 2,
        "name": "橘子",
        "price": 15
    },
    {
        "id": 3,
        "name": "西瓜",
        "price": 8
    }
]

http://localhost:3000/goods?id=1

[
    {
        "id": 1,
        "name": "苹果",
        "price": 10
    }
]

分页查询

默认后台处理分页参数为: _page 第几页, _limit一页多少条。

http://localhost:3000/goods?_page=2&_limit=5

[
    {
        "id": 6,
        "name": "橘子3",
        "price": 15
    },
    {
        "id": 7,
        "name": "橘子4",
        "price": 15
    },
    {
        "id": 8,
        "name": "橘子5",
        "price": 15
    },
    {
        "id": 9,
        "name": "橘子6",
        "price": 15
    }
]

排序

参数: _sort设定排序的字段, _order设定排序的方式(默认升序 asc, desc)

http://localhost:3000/goods?_page=2&_limit=5&_sort=id

http://localhost:3000/goods?_page=2&_limit=5&_sort=id&_order=desc

http://localhost:3000/goods?_page=2&_limit=5&_sort=id&_order=asc

支持多个字段排序:

http://localhost:3000/goods?_page=2&_limit=5&_sort=id,price&_order=asc

http://localhost:3000/goods?_limit=5&_sort=price,id&_order=asc,asc

任意切片数据(Slice)

http://localhost:3000/goods?_start=3&_end=7

全文检索

可以通过q参数进行全文检索

http://localhost:3000/goods?q=6

web服务器json-serve详解

 

关键词:web服务器      点击(12)
声明:本站部分内容来自互联网,如有版权侵犯或其他问题请与我们联系,我们将立即删除或处理。
▍相关推荐
更多web服务器相关>>>