文章目录

  • 介绍
  • HTTP请求测试
  • GET
  • 查询列表
  • 根据ID查询
  • 参数化查询
  • 分页查询
  • 排序
  • 比较器
  • 全文检索
  • POST
  • PUT
  • DELETE
  • 小结


介绍

今天在开发小程序应用时接触到一款简单易用的前端Mock工具，特此整理记录。json-server是一款非常简单易用的数据Mock工具，对于前端开发测试接口时非常适用，只需要提供对应的JSON数据就可以Mock出一个接口来。

GitHub地址：https://github.com/typicode/json-server

安装命令，需要先安装node

npm install -g json-server

安装完成之后,选择本地的一个目录作为数据存储地方，然后创建db.json文件，并写入下面的测试内容

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

启动JSON服务，在db.json目录下运行启动命令

json-server --watch db.json

java mock接口和实际接口怎么切换_HTTP接口


上面的Resources表示当前服务提供了那些端点接口，默认启动的是3000端口

HTTP请求测试

GET

查询列表

java mock接口和实际接口怎么切换_Mock工具_02

根据ID查询

java mock接口和实际接口怎么切换_HTTP接口_03

参数化查询

http://localhost:3000/posts?title=json-server-2&author=typicode-2

java mock接口和实际接口怎么切换_前端开发_04

分页查询

GET /posts?_page=1
 GET /posts?_page=1&_limit=3

默认limit为10

java mock接口和实际接口怎么切换_Mock工具_05

排序

可以使用_sort 和 _order属性来进行数据排序，其中 _order默认是asc升序

http://localhost:3000/posts?_sort=view&_order=asc

java mock接口和实际接口怎么切换_json-server_06

比较器

【1】通过_gte和_lte去进行数字类型数据范围的查找

http://localhost:3000/posts?view_gte=20&view_lte=200

java mock接口和实际接口怎么切换_前端开发_07


【2】通过_ne去进行数据的排除

http://localhost:3000/posts?author_ne=typicode-1java mock接口和实际接口怎么切换_json-server_08

【3】使用_like进行模糊查询

http://localhost:3000/posts?author_like=code


全文检索

通过q进行全文检索

GET /posts?q=internet

java mock接口和实际接口怎么切换_json-server_09

POST

Post用于新增数据，数据会被写入到json文件中，可以被实时查询到

java mock接口和实际接口怎么切换_json-server_10

PUT

PUT用于更新数据，数据会被写入到json文件中，可以被实时查询到

PUT http://localhost:3000/posts/1 需要指定路径参数

java mock接口和实际接口怎么切换_数据模拟_11

DELETE

DELETE /posts/1

java mock接口和实际接口怎么切换_数据模拟_12

小结

该工具支持多个主流的HTTP方法请求，其中POST/PUT等会将请求的数据写入到本地的db.json文件中去。POST/PUT请求需要指定Content-Type: application/json请求头格式。

如果手动修改文件是不会热加载的，需要重新启动。但是通过POST、PUT等方法变更的数据是会被实时查询到的。

PUT/POST默认会添加一个ID属性，POST时如果JSON请求体内有冲突的ID，则提交失败，异常信息如下

java mock接口和实际接口怎么切换_HTTP接口_13


可以通过json-server --watch db.json --port 3004自定义启动端口。

对于团队内开发可以访问远程服务器文件，或者互相访问

$ json-server http://example.com/file.json
$ json-server http://jsonplaceholder.typicode.com/db

自己也只是项目开发中刚刚接触，官方文档还提及了生成随机数据、添加自定义路由、设置中间件（修改头部，鉴权等）、集成其他三方工具等等，详细的可以参考官方文档 https://github.com/typicode/json-server