使用Json-server搭建mock服务器
source link: https://xmanyou.com/json-server-as-mock-server/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Json-server项目是一个开源的REST API服务器。使用者通过json定义好数据,就可以自动生成相关的API接口,并提供了很多自定义选项。
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来实现。
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK