使用Json-server搭建mock服务器
Json-server项目是一个开源的REST API服务器。使用者通过json定义好数据,就可以自动生成相关的API接口,并提供了很多自定义选项。
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来实现。