文章目录
- json-server介绍
- 简介
- 操作步骤
- 操作数据
- 增（POST）
- 删（DELETE）
- 改（UPDATE、PATCH）
- 查（GET）
- 筛选
- 分页
- 排序
- 切片(分页)
- 特殊符号
- 添加`_gte`或`_lte`获取范围
- 添加`_ne`以排除值
- 添加`_like`到过滤器（支持正则表达式）
- 全文搜索
- 关系
- 要包含子资源，请添加` _embed`
- 要包含父资源，请添加 `_expand`
- 获取或创建嵌套资源（默认为一级）
json-server介绍
简介
json-server 是一款小巧的接口模拟工具，一分钟内就能搭建一套 Restful 风格的 api，尤其适合前端接口测试使用。
只需指定一个 json 文件作为 api 的数据源即可，使用起来非常方便，30秒入门——可以对接口数据进行增删改查。
进阶操作还支持分页，排序等操作。
开源地址
主页地址：https://www.npmjs.com/package/json-server
Github项目地址：https://github.com/typicode/json-server
https://gitcode.net/mirrors/typicode/json-server?utm_source=csdn_github_accelerator
操作步骤
- 全局安装
json-server
npm i -g json-server# 查看版本
json-server -v
- 创建一个
db.json数据文件
{"posts": [{ "id": 1, "title": "json-server", "author": "typicode" }],"comments": [{ "id": 1, "body": "some comment", "postId": 1 }],"profile": { "name": "typicode" }
}
注意： 数据与数据之间的关系，例如：posts——postId
- 启动
json-server接口服务器
# 默认端口为3000
json-server --watch db.json
或
json-server --watch db.json --port 端口号
- 浏览器访问
http://localhost:3000/posts/1，你会得到
{ "id": 1, "title": "json-server", "author": "typicode" }
补充
- 如果您发出 POST、PUT、PATCH 或 DELETE 请求，更改将自动安全地保存到 db.json 文件中。
- 注意 Id 值是不可变的。
操作数据
增（POST）
// 添加新闻
export const addNews = (params) => request.post(`/news`, params)
删（DELETE）
// 删除新闻
export const deleteNews = (params) => request.delete(`/news/${params.id}`)
改（UPDATE、PATCH）
// 修改新闻
// update: 需要传所有参数，没传的为undefiend
export const patchNews = (params) => request.patch(`/news/${params.id}`, params)
// patch：只传需要修改的参数，没传的默认不修改
export const patchNews = (params) => request.patch(`/news/${params.id}`, params)
查（GET）
// 获取用户列表
export const queryUserList = () => request.get(`/users?_expand=role`)// 获取用户信息
export const queryUserInfo = (params) => request.get(`/users/${params.id}?_expand=role`)
筛选
使用 . 访问筛选
GET /posts?title=json-server&author=typicode
GET /posts?id=1&id=2
GET /comments?author.name=typicode
分页
使用_page和可选地_limit对返回的数据进行分页。
在Link标题，你会得到first，prev，next和last链接。
GET /posts?_page=7
GET /posts?_page=7&_limit=20
默认返回10项
排序
添加_sort和_order（默认升序）
GET /posts?_sort=views&_order=asc
GET /posts/1/comments?_sort=votes&_order=asc
对于多个字段，请使用以下格式：
GET /posts?_sort=user,views&_order=desc,asc
切片(分页)
添加_start和_end或_limit
GET /posts?_start=20&_end=30
GET /posts/1/comments?_start=20&_end=30
GET /posts/1/comments?_start=20&_limit=10
与Array.slice完全一样工作（即_start开始_end结束）
特殊符号
添加_gte或_lte获取范围
GET /posts?views_gte=10&views_lte=20
添加_ne以排除值
GET /posts?id_ne=1
添加_like到过滤器（支持正则表达式）
GET /posts?title_like=server
全文搜索
添加 q
GET /posts?q=internet
关系
要包含子资源，请添加 _embed
GET /posts?_embed=comments
GET /posts/1?_embed=comments
要包含父资源，请添加 _expand
GET /comments?_expand=post
GET /comments/1?_expand=post
获取或创建嵌套资源（默认为一级）
GET /posts/1/comments
POST /posts/1/comments
命令行使用
json-server [options] <source>
Options:--config, -c Path to config file [default: "json-server.json"]--port, -p Set port [default: 3000]--host, -H Set host [default: "localhost"]--watch, -w Watch file(s) [boolean]--routes, -r Path to routes file--middlewares, -m Paths to middleware files [array]--static, -s Set static files directory--read-only, --ro Allow only GET requests [boolean]--no-cors, --nc Disable Cross-Origin Resource Sharing [boolean]--no-gzip, --ng Disable GZIP Content-Encoding [boolean]--snapshots, -S Set snapshots directory [default: "."]--delay, -d Add delay to responses (ms)--id, -i Set database id property (e.g. _id) [default: "id"]--foreignKeySuffix, --fks Set foreign key suffix, (e.g. _id as in post_id)[default: "Id"]--quiet, -q Suppress log messages from output [boolean]--help, -h Show help [boolean]--version, -v Show version number [boolean]
Examples:json-server db.jsonjson-server file.jsjson-server http://example.com/db.jsonhttps://github.com/typicode/json-server
您还可以在json-server.json配置文件中设置选项。{"port": 3000
}
