JSON Server 详细使用教程

简介

JSON Server 是一个非常实用的工具,可以让你快速搭建一个模拟 REST API。它可以基于一个 JSON 文件快速创建一个全功能的假 REST API,非常适合前端开发时做原型或 mock 数据。本文将详细介绍 JSON Server 的安装和使用方法。

安装

JSON Server 是一个 Node.js 模块,可以通过 npm 安装:

npm install -g json-server
创建 JSON 数据文件

首先创建一个 JSON 文件,例如 db.json:

{"posts": [{ "id": 1, "title": "json-server", "author": "typicode" }],"comments": [{ "id": 1, "body": "some comment", "postId": 1 }],"profile": { "name": "typicode" }
}
启动服务器

在命令行中,进入 db.json 所在目录,运行:

json-server --watch db.json

现在,你就可以通过 http://localhost:3000 访问你的 API 了。

API 路由

JSON Server 会根据你的 JSON 文件自动生成以下路由:

  • GET /posts
  • GET /posts/1
  • POST /posts
  • PUT /posts/1
  • PATCH /posts/1
  • DELETE /posts/1

类似地,其他顶级属性(如 comments, profile)也会生成对应的路由。

高级用法

        自定义路由

你可以创建一个 routes.json 文件来自定义路由:

{"/api/*": "/$1","/:resource/:id/show": "/:resource/:id","/posts/:category": "/posts?category=:category","/articles\\?id=:id": "/posts/:id"
}

然后启动服务器时使用 --routes 选项:

json-server db.json --routes routes.json

        使用中间件

你可以使用 JSON Server 的中间件来添加自定义逻辑。创建一个 middleware.js 文件:

module.exports = (req, res, next) => {if (req.method === 'POST') {req.body.createdAt = Date.now()}next()
}

然后在启动服务器时使用 --middlewares 选项:

json-server db.json --middlewares ./middleware.js

        生成随机数据

JSON Server 使用 Faker.js 来生成随机数据。你可以在 db.json 中使用 JS 代码来生成数据:

module.exports = () => {const data = { users: [] }for (let i = 0; i < 50; i++) {data.users.push({ id: i, name: `user${i}` })}return data
}

        全文搜索

JSON Server 支持全文搜索,只需在 GET 请求中添加 q 参数:

GET /posts?q=internet

        关系

你可以在资源之间建立父子关系:

GET /posts/1/comments
POST /posts/1/comments

        分页

JSON Server 默认支持分页,使用 _page_limit 参数:

GET /posts?_page=7&_limit=20

        部署

JSON Server 可以很容易地部署到各种平台,如 Heroku、Now 等。你只需要创建一个简单的 server.js 文件:

const jsonServer = require('json-server')
const server = jsonServer.create()
const router = jsonServer.router('db.json')
const middlewares = jsonServer.defaults()server.use(middlewares)
server.use(router)
server.listen(3000, () => {console.log('JSON Server is running')
})

然后按照各平台的部署指南进行部署即可。

总结

JSON Server 是一个强大而灵活的工具,可以快速创建模拟 REST API。它不仅适用于前端开发的原型设计和测试,也可以用于后端开发的 API 设计和文档编写。通过本教程,你应该能够掌握 JSON Server 的基本使用方法,并能够根据需要进行更高级的配置和使用。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/1474272.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

【电商系统开发实用接口指南】包含国内国外多电商平台商品数据对接(附文档)

关于电商数据接口 开发电商系统的朋友对于电商平台API肯定不陌生&#xff0c;API接口即应用程序编程接口&#xff0c;电商平台开放部分API接口&#xff0c;供商家和服务商调用&#xff0c;以满足电商业务管理需求。随着电商市场需求的日益增长以及技术手段的不断成熟&#xf…

推荐3款【王炸级别】的效率软件,免费无广告,你一定要收藏

Temp Cleaner Temp Cleaner 是一款专为 Windows 操作系统设计的临时文件清理工具。它的主要功能是安全且快速地清理磁盘上的临时文件和系统缓存&#xff0c;从而释放磁盘空间。该软件体积小巧&#xff08;仅有826KB&#xff09;&#xff0c;并且是无广告的绿色软件&#xff0c;…

77. UE5 RPG 创建角色的技能栏

在前面的文章里&#xff0c;我们实现了角色属性技能和场景。接下来&#xff0c;我们要优化角色显示UI&#xff0c;在屏幕底部显示角色血量&#xff0c;蓝量&#xff0c;技能和经验值。 创建新的用户控件 选择创建新的控件蓝图 父类为我们自定义的RPGUserWidget&#xff0c;这…

CIRKD

环境不好满足&#xff0c;不建议复现

【SOLID原则前端中的应用】里氏替换原则(Liskov Substitution Principle,LSP)- vue3示例

里氏替换原则&#xff08;Liskov Substitution Principle&#xff0c;LSP&#xff09;规定&#xff0c;子类对象必须能够替换父类对象&#xff0c;并且程序的行为保持不变。 在Vue 3中&#xff0c;这意味着我们在创建可替换的组件时&#xff0c;应该确保子组件能够完全替代父组…

LeetCode 744, 49, 207

目录 744. 寻找比目标字母大的最小字母题目链接标签思路代码 49. 字母异位词分组题目链接标签思路代码 207. 课程表题目链接标签思路代码 744. 寻找比目标字母大的最小字母 题目链接 744. 寻找比目标字母大的最小字母 标签 数组 二分查找 思路 本题比 基础二分查找 难的一…

Vue3+.NET6前后端分离式管理后台实战(二十九)

1&#xff0c;Vue3.NET6前后端分离式管理后台实战(二十九)

Linux笔记之二

Linux笔记之二 一、文件属性学习二、软链接和硬链接1.软链接2.硬链接 三、Vim编辑器四、账号管理总结 一、文件属性学习 Linux 系统是一种典型的多用户系统&#xff0c;不同的用户处于不同的地位&#xff0c;拥有不同的权限。为了保护系统的安全性&#xff0c;Linux系统对不同…

cf 7.7

Problem - C - Codeforces 大致意思&#xff1a; 找前缀&#xff0c;排序后使得本位之前数字和等于该位 &#xff08;以下代码超时了&#xff09; #include<bits/stdc.h> typedef long long ll;#define IOS ios::sync_with_stdio(0),cin.tie(0),cout.tie(0) const ll …

笔记15:while语句编程练习

练习一&#xff1a; 编写程序&#xff0c;求 2^24^26^2...n^2? -直到累加和大于或等于 10000 为止&#xff0c;输出累加和 -输出累加式中的项数&#xff0c;以及最大的数 n #include<stdio.h> int main() {int sum 0;int i 1;int n 0;while(sum < 10000)//将sum…

Objects365数据集介绍

Objects365数据集介绍 什么是Objects365数据集&#xff1f;数据集的规模与内容数据集的特点数据集下载 什么是Objects365数据集&#xff1f; Objects365是一个大规模、高质量的物体检测数据集。该数据集旨在推动物体检测技术的发展&#xff0c;特别是在真实世界场景下的应用。O…

嵌入式c语言——类型修饰符

register&#xff0c;将变量保存在寄存器中&#xff0c;使得访问速度增加 const是常量&#xff0c;static是静态量&#xff0c;volatile是

云原生技术架构详解

云原生技术最全详解(图文全面总结) 容器技术 容器技术&#xff1a;是将应用程序、及其所有依赖项&#xff0c;打包到一个独立的、可移植的容器中。 如下图所示: 容器技术的实现&#xff0c;最典型的就是以Docker为代表的。 如下图所示&#xff1a; 主要解决&#xff1a; 1、…

flask模块化、封装使用cache(flask_caching)

1.安装flask_caching库 pip install flask_caching 2.创建utils Python 软件包以及cache_helper.py 2.1cache_helper.py代码 from flask_caching import Cachecache Cache()class CacheHelper:def __init__(self, app, config):cache.init_app(app, config)staticmethoddef…

Unity编辑器扩展之Inspector面板扩展

内容将会持续更新&#xff0c;有错误的地方欢迎指正&#xff0c;谢谢! Unity编辑器扩展之Inspector面板扩展 TechX 坚持将创新的科技带给世界&#xff01; 拥有更好的学习体验 —— 不断努力&#xff0c;不断进步&#xff0c;不断探索 TechX —— 心探索、心进取&#xff…

JavaScript 原型链那些事

在讲原型之前我们先来了解一下函数。 在JS中&#xff0c;函数的本质就是对象&#xff0c;它与其他对象不同的是&#xff0c;创建它的构造函数与创建其他对象的构造函数不一样。那产生函数对象的构造函数是什么呢&#xff1f;是一个叫做Function的特殊函数&#xff0c;通过newFu…

数据库、创建表、修改表

一、数据库 1、登陆数据库 2、创建数据库zoo 3、修改数据库zoo字符集为gbk 4、选择当前数据库为zoo 5、查看创建数据库zoo信息 6、删除数据库zoo 二、创建表 1、创建一个名称为db_system的数据库 2、在该数据库下创建两张表&#xff0c;具体要求如下 员工表 user…

VMware虚拟机配置桥接网络

转载&#xff1a;虚拟机桥接网络配置 一、VMware三种网络连接方式 VMware提供了三种网络连接方式&#xff0c;VMnet0, VMnet1, Vmnet8&#xff0c;分别代表桥接&#xff0c;Host-only及NAT模式。在VMware的编辑-虚拟网络编辑器可看到对应三种连接方式的设置&#xff08;如下图…

【JVM系列】Full GC(完全垃圾回收)的原因及分析

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…

【C++ OpenCV】机器视觉-二值图像和灰度图像的膨胀、腐蚀、开运算、闭运算

原图 结果图 //包含头文件 #include <opencv2/opencv.hpp>//命名空间 using namespace cv; using namespace std;//全局函数声明部分//我的腐蚀运算 Mat Erode(Mat src, Mat Mask, uint32_t x0, uint32_t y0) {uint32_t x 0, y 0;Mat dst(src.rows, src.cols, CV_8U…