有趣的 npm 库 · json-server

json-server:5 分钟,用一个 JSON 文件,让你拥有一个能 CRUD 的本地 API。

1. 它是什么?

一句话解释:

一个用 JSON 文件直接生成完整 REST API 的工具,并且支持直接对这个 JSON 数据进行增删查改(持久化到文件)。

2. 适用场景

  • 前后端分离开发:后端还没准备好,前端需要先调试数据
  • 快速原型:做 DEMO 给客户看,不想搭后端
  • 离线开发:出差、没网、本地调试,依然能跑
  • 可控测试数据:自动化测试需要稳定、可修改的接口响应

3. 核心优势

1) JSON 文件 = 简单数据库

  • • 所有的增删查改都会直接作用在本地 db.json 文件上,并且立即持久化
  • • 关掉服务、重启电脑,数据依然在
  • • 这个文件可以放进 Git 仓库,随代码同步
  • • 不需要 MySQL/Mongo,JSON 本身就是数据库

⚡ 2) 真 RESTful API,开箱即用

  • • 无需写任何路由或控制器
  • • 自动生成 GET / POST / PUT / PATCH / DELETE 接口
  • • 直接在 axios、fetch 里调用,和真实后端一样

3) 内置查询功能

支持常见数据操作,无需写 SQL:

复制代码
GET /users?name=Tom                # 条件筛选
GET /users?_page=1&_limit=5         # 分页
GET /users?_sort=name&_order=desc   # 排序
GET /users?q=keyword                # 全文搜索

4) 极简 + 可扩展

  • • 上手只需一条命令
  • • 如果需要复杂逻辑,可以写 server.js 自定义中间件、路由、数据生成逻辑(结合 faker.js)

4. 和其他 Mock 工具的区别

|-------------------------|-------------------------|---------------|---------|
| 工具 | 主要特点 | 数据是否持久化 | 是否需平台依赖 |
| json-server | 本地 JSON 文件生成 REST API | ✅ 是 | ❌ 否 |
| Apifox / Apipost / YApi | 在线接口管理 + Mock + 测试 + 文档 | ❌ 否(平台级 mock) | ✅ 是 |
| Mock.js | 浏览器端生成随机数据 | ❌ 否 | ❌ 否 |


5. 快速上手

安装

复制代码
npm install -g json-server

准备数据

db.json

复制代码
{
  "users":[
    {"id":1,"name":"Tom"},
    {"id":2,"name":"Jerry"}
]
}

启动服务

复制代码
json-server --watch db.json --port 3000

访问接口

复制代码
GET    http://localhost:3000/users
POST   http://localhost:3000/users
PUT    http://localhost:3000/users/1
DELETE http://localhost:3000/users/1

6. 使用限制与注意事项

虽然 json-server 很好用,但它并不是万能的:

  • • 只适合简单的增删查改场景
  • • 不支持复杂的业务逻辑(如多表关联、事务处理、权限校验)
  • • 性能上不适合高并发或海量数据
  • 生产环境建议使用正规后端 API,json-server 更适合作为开发阶段的辅助工具

7. 总结

如果你需要一个:

  • 能直接 CRUD 的本地 API
  • 数据真实可落地(文件持久化)
  • 无需复杂配置 的 mock 工具

那么 json-server 是一个极其高效的选择。

但如果你的需求涉及复杂业务逻辑、权限控制、关联查询等,请选择真正的后端服务来支撑。

相关推荐
视觉AI2 小时前
HTTP 请求与数据交互全景指南:Request、GET、POST、JSON 及 curl
http·json·交互
夏鹏今天学习了吗3 小时前
【性能优化】前端高性能优化策略
前端·性能优化
weixin_427771616 小时前
css font-size 的妙用
前端·css
凤凰战士芭比Q7 小时前
web中间件——Nginx
前端·nginx·中间件
一 乐7 小时前
点餐|智能点餐系统|基于java+ Springboot的动端的点餐系统小程序(源码+数据库+文档)
java·前端·数据库·vue.js·spring boot·小程序·论文
bitbitDown8 小时前
从零打造一个 Vite 脚手架工具:比你想象的简单多了
前端·javascript·面试
liangshanbo12158 小时前
CSS 数学函数完全指南:从基础计算到高级动画
前端·css
码上成长9 小时前
GraphQL:让前端自己决定要什么数据
前端·后端·graphql
冴羽10 小时前
为什么在 JavaScript 中 NaN !== NaN?背后藏着 40 年的技术故事
前端·javascript·node.js
久爱@勿忘10 小时前
vue下载项目内静态文件
前端·javascript·vue.js