当前位置: 首页 > news >正文

不部署服务端调用接口,前端接口神器json-server

简介

json-server 是一款小巧的接口模拟工具,一分钟内就能搭建一套 Restful 风格的 API,尤其适合前端接口测试使用。
只需指定一个 json 文件作为 api 的数据源即可,使用起来非常方便,30秒入门,基本上有手就行。
进阶操作还支持分页,排序等操作,简直强大。

开源地址

主页地址:json-server - npm
Github项目地址:GitHub - typicode/json-server: Get a full fake REST API with zero coding in less than 30 seconds (seriously)

30秒入门

环境依赖

  • 安装 Node.js 环境即可

操作步骤

  1. 安装 JSON 服务器
npm install -g json-server
  1. 创建一个db.json包含一些数据的文件
{"posts": [{ "id": 1, "title": "json-server", "author": "typicode" }],"comments": [{ "id": 1, "body": "some comment", "postId": 1 }],"profile": { "name": "typicode" }
}
  1. 启动 json-server 接口服务器
json-server --watch db.json
  1. 浏览器访问 http://localhost:3000/posts/1,你会得到
{ "id": 1, "title": "json-server", "author": "typicode" }

补充

  • 如果您发出 POST、PUT、PATCH 或 DELETE 请求,更改将自动安全地保存到 db.json 文件中。
  • 注意 id 值是不可变的。

路由进阶

根据之前的db.json文件,这里是所有的默认路由。

路由形式一

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

路由形式二

GET    /profile
POST   /profile
PUT    /profile
PATCH  /profile

筛选

使用 . 访问筛选

GET /posts?title=json-server&author=typicode
GET /posts?id=1&id=2
GET /comments?author.name=typicode

分页

使用_page和可选地_limit对返回的数据进行分页。

Link标题,你会得到firstprevnextlast链接。

GET /posts?_page=7
GET /posts?_page=7&_limit=20

默认返回10项

排序

添加_sort_order(默认升序)

GET /posts?_sort=views&_order=asc
GET /posts/1/comments?_sort=votes&_order=asc

对于多个字段,请使用以下格式:

GET /posts?_sort=user,views&_order=desc,asc

切片(分页)

添加_start_end_limit

GET /posts?_start=20&_end=30
GET /posts/1/comments?_start=20&_end=30
GET /posts/1/comments?_start=20&_limit=10

与Array.slice完全一样工作(即_start开始_end结束)

特殊符号

添加_gte_lte获取范围

GET /posts?views_gte=10&views_lte=20

添加_ne以排除值

GET /posts?id_ne=1

添加_like到过滤器(支持正则表达式)

GET /posts?title_like=server

全文搜索

添加 q

GET /posts?q=internet

关系

要包含子资源,请添加 _embed

GET /posts?_embed=comments
GET /posts/1?_embed=comments

要包含父资源,请添加 _expand

GET /comments?_expand=post
GET /comments/1?_expand=post

获取或创建嵌套资源(默认为一级)

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

数据库

GET /db

主页

返回默认索引文件或服务./public目录

GET /

附加功能

静态文件服务器

您可以使用 JSON Server 为您的 HTML、JS 和 CSS 提供服务,只需创建一个./public目录或用于--static设置不同的静态文件目录。

mkdir public
echo 'hello world' > public/index.html
json-server db.json
json-server db.json --static ./some-other-dir

替换端口

您可以使用以下--port标志在其他端口上启动 JSON Server :

$ json-server --watch db.json --port 3004

支持跨域

您可以使用 CORS 和 JSONP 从任何地方访问您模拟的 API 接口。

远程模式

您可以加载远程模式。

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

生成随机数据

使用 JS 而不是 JSON 文件,您可以通过编程方式创建数据。

// index.js
module.exports = () => {const data = { users: [] }// 创建 1000 个用户信息for (let i = 0; i < 1000; i++) {data.users.push({ id: i, name: `user${i}` })}return data
}
$ json-server index.js

提示:使用Faker、Casual、Chance或JSON Schema Faker 等模块。

添加自定义路由

创建一个routes.json文件。注意每条路线都以/.

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

使用--routes选项启动 JSON 服务器。

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

现在您可以使用其他路线访问资源。

/api/posts # → /posts
/api/posts/1  # → /posts/1
/posts/1/show # → /posts/1
/posts/javascript # → /posts?category=javascript
/articles?id=1 # → /posts/1

添加中间件

您可以使用以下--middlewares选项从 CLI 添加中间件:

// hello.js
module.exports = (req, res, next) => {res.header('X-Hello', 'World')next()
}
json-server db.json --middlewares ./hello.js
json-server db.json --middlewares ./first.js ./second.js

命令行使用

json-server [options] <source>Options:--config, -c       Path to config file           [default: "json-server.json"]--port, -p         Set port                                    [default: 3000]--host, -H         Set host                             [default: "localhost"]--watch, -w        Watch file(s)                                     [boolean]--routes, -r       Path to routes file--middlewares, -m  Paths to middleware files                           [array]--static, -s       Set static files directory--read-only, --ro  Allow only GET requests                           [boolean]--no-cors, --nc    Disable Cross-Origin Resource Sharing             [boolean]--no-gzip, --ng    Disable GZIP Content-Encoding                     [boolean]--snapshots, -S    Set snapshots directory                      [default: "."]--delay, -d        Add delay to responses (ms)--id, -i           Set database id property (e.g. _id)         [default: "id"]--foreignKeySuffix, --fks  Set foreign key suffix, (e.g. _id as in post_id)[default: "Id"]--quiet, -q        Suppress log messages from output                 [boolean]--help, -h         Show help                                         [boolean]--version, -v      Show version number                               [boolean]Examples:json-server db.jsonjson-server file.jsjson-server http://example.com/db.jsonhttps://github.com/typicode/json-server

您还可以在json-server.json配置文件中设置选项。

{"port": 3000
}

模块

如果您需要添加身份验证、验证或任何行为,您可以将项目作为模块与其他 Express 中间件结合使用。

简单的例子

$ npm install json-server --save-dev
// 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')
})
$ node server.js

您提供给jsonServer.router函数的路径是相对于您启动节点进程的目录的。如果从另一个目录运行上述代码,最好使用绝对路径:

const path = require('path')
const router = jsonServer.router(path.join(__dirname, 'db.json'))

对于内存数据库,只需将对象传递给jsonServer.router().

另请注意,jsonServer.router()它可用于现有的 Express 项目。

自定义路由示例

假设您想要一个回显查询参数的路由和另一个在创建的每个资源上设置时间戳的路由。

const jsonServer = require('json-server')
const server = jsonServer.create()
const router = jsonServer.router('db.json')
const middlewares = jsonServer.defaults()// 设置默认中间件(记录器、静态、cors 和无缓存)
server.use(middlewares)// 写在自定义路由之前
server.get('/echo', (req, res) => {res.jsonp(req.query)
})// 要处理 POST、PUT 和 PATCH,您需要使用 body-parser
// 您可以使用 JSON Server
server.use(jsonServer.bodyParser)
server.use((req, res, next) => {if (req.method === 'POST') {req.body.createdAt = Date.now()}// 继续到 JSON Server 路由器next()
})// 使用默认路由器
server.use(router)
server.listen(3000, () => {console.log('JSON Server is running')
})

访问控制示例

const jsonServer = require('json-server')
const server = jsonServer.create()
const router = jsonServer.router('db.json')
const middlewares = jsonServer.defaults()server.use(middlewares)
server.use((req, res, next) => {if (isAuthorized(req)) { // 在此处添加您的授权逻辑next() // 继续到 JSON Server 路由器} else {res.sendStatus(401)}
})
server.use(router)
server.listen(3000, () => {console.log('JSON Server is running')
})

自定义输出示例

要修改响应,请覆盖router.render方法:

// 在这个例子中,返回的资源将被包装在一个 body 属性
router.render = (req, res) => {res.jsonp({body: res.locals.data})
}

您可以为响应设置自己的状态代码:

// 在这个例子中,我们模拟了一个服务器端错误响应
router.render = (req, res) => {res.status(500).jsonp({error: "error message here"})
}

重写器示例

要添加重写规则,请使用jsonServer.rewriter()

// 写在 server.use(router) 之前
server.use(jsonServer.rewriter({'/api/*': '/$1','/blog/:resource/:id/show': '/:resource/:id'
}))

在另一个端点上挂载 JSON 服务器示例

或者,您也可以将路由器安装在/api.

server.use('/api', router)

API

jsonServer.create()

返回一个 Express 服务器。

jsonServer.defaults([options])

返回 JSON 服务器使用的中间件。

  • 选项
    • static 静态文件的路径
    • logger 启用记录器中间件(默认值:true)
    • bodyParser 启用 body-parser 中间件(默认值:true)
    • noCors 禁用 CORS(默认值:false)
    • readOnly 只接受 GET 请求(默认值:false)

jsonServer.router([path|object])

返回 JSON 服务器路由器。

相关文章:

不部署服务端调用接口,前端接口神器json-server

简介 json-server 是一款小巧的接口模拟工具&#xff0c;一分钟内就能搭建一套 Restful 风格的 API&#xff0c;尤其适合前端接口测试使用。 只需指定一个 json 文件作为 api 的数据源即可&#xff0c;使用起来非常方便&#xff0c;30秒入门&#xff0c;基本上有手就行。 进阶…...

国产化:复旦微JFM7K325T +华为海思 HI3531DV200 的综合视频处理平台

板卡概述 TES714 是自主研制的一款 5 路 HD-SDI 视频采集图像处理平台&#xff0c;该平台采用上海复旦微的高性能 Kintex 系列 FPGA 加上华为海 思的高性能视频处理器 HI3531DV200 来实现。 华为海思的 HI3531DV200 是一款集成了 ARM A53 四核处理 器性能强大的神经网络引擎…...

Ceph入门到精通- stderr raise RuntimeError(‘Unable to create a new OSD id‘)

/bin/podman: stderr raise RuntimeError(Unable to create a new OSD id) podman ps |grep osd.0 podman stop osd.0 容器id 重新添加osd.0 集群目录 cd /var/lib/ceph/e8cde810-e4b8-11ed-9ba8-98039b976596/1109 ls1110 rm -rf osd.01111 ceph orch daemon add osd…...

AWSFireLens轻松实现容器日志处理

applog应用程序和fluent-bit共享磁盘&#xff0c;日志内容是json格式数据&#xff0c;输出到S3也是JSON格式 applog应用部分在applog目录&#xff1a; Dockerfile文件内容 FROM alpine RUN mkdir -p /data/logs/ COPY testlog.sh /bin/ RUN chmod 777 /bin/testlog.sh ENTRYP…...

Java程序设计入门教程--案例:自由落体

程序模拟物体从10000米高空掉落后的反弹行为。 球体每落地一次&#xff0c;就会反弹至原高度的一半。按用户输入的弹跳次数&#xff0c;计算球体每次弹跳的高度。 实现过程&#xff1a; 1. 新建项目&#xff1b; 2. 接收 用户输入的弹跳次数&#xff1a; &#xff08;1&#…...

Qt音视频开发44-本地摄像头推流(支持分辨率/帧率等设置/实时性极高)

一、前言 本地摄像头推流和本地桌面推流类似&#xff0c;无非就是采集的设备源头换成了本地摄像头设备而不是桌面&#xff0c;其他代码完全一样。采集本地摄像头实时视频要注意的是如果设置分辨率和帧率&#xff0c;一定要是设备本身就支持的&#xff0c;如果不支持那就歇菜&a…...

SpringCloud学习(七)——统一网关Gateway

文章目录 1. 网关介绍2. 网关搭建2.1 引入依赖2.2 创建启动类2.3 编写配置2.4 测试 3. 路由断言工厂4. 路由过滤器4.1 过滤器配置4.2 全局过滤器4.3 过滤器执行顺序 5. 跨域问题处理 1. 网关介绍 到现在&#xff0c;我们可以使用Nacos对不同的微服务进行注册并管理配置文件&am…...

《花雕学AI》31:ChatGPT--用关键词/咒语/提示词Prompt激发AI绘画的无限创意!

你有没有想过用AI来画画&#xff1f;ChatGPT是一款基于GPT-3的聊天模式的AI绘画工具&#xff0c;它可以根据你输入的关键词/咒语/提示词Prompt来生成不同风格和主题的画作。Prompt是一些简短的文字&#xff0c;可以用来指导ChatGPT的创作过程。在这篇文章中&#xff0c;我将展示…...

计算机组成原理9控制单元的结构

9.1操作命令的分析 取值周期间址周期执行周期中断周期 取指周期数据流 PC存放下条指令的地址给MAR访问存储器相应单元&#xff0c;将数据取出来送给MDR寄存器&#xff0c;MDR取出来的内容送给IR指令寄存器&#xff0c;然后对指令进行译码&#xff0c;把指令的操作码部分取出…...

MySQL数据备份和恢复

MySQL数据备份和恢复 数据备份 mysqldump是MySQL数据库备份工具&#xff0c;可以备份MySQL数据库中的数据和结构&#xff0c;生成.sql文件&#xff0c;方便数据的迁移和恢复。 使用mysqldump工具前一定要配置环境变量 打开开始菜单&#xff0c;搜索“环境变量”。点击“编辑…...

数据结构与算法之链表: Leetcode 237. 删除链表中的节点 (Typescript版)

删除链表中的节点 https://leetcode.cn/problems/delete-node-in-a-linked-list/ 描述 有一个单链表的 head&#xff0c;我们想删除它其中的一个节点 node。 给你一个需要删除的节点 node 。你将 无法访问 第一个节点 head。 链表的所有值都是 唯一的&#xff0c;并且保证给…...

继承的相关介绍---C++

一、概念及定义 概念&#xff1a; 继承(inheritance)机制是面向对象程序设计使代码可以复用的最重要的手段&#xff0c;它允许程序员在保持原有类特性的基础上进行扩展&#xff0c;增加功能&#xff0c;这样产生新的类&#xff0c;称派生类。继承呈现了面向对象程序设计的层次结…...

Java多线程深入探讨

1. 线程与进程2. 创建和管理线程2.1. 继承Thread类2.2. 实现Runnable接口2.3 利用Callable、FutureTask接口实现。2.4 Thread的常用方法 3. 线程同步3.1. synchronized关键字3.1.1同步代码块&#xff1a;3.1.2 同步方法&#xff1a; 3.2. Lock接口 4. 线程间通信5. 线程池5.1 使…...

SpringCloud全面学习笔记之进阶篇

目录 前言微服务保护初识Sentinel雪崩问题及解决方案雪崩问题超时处理仓壁模式熔断降级流量控制总结 服务保护技术对比Sentinel介绍和安装微服务整合Sentinel 流量控制快速入门流控模式关联模式链路模式小结 流控效果warm up排队等待 热点参数限流全局参数限流热点参数限流案例…...

英语中主语从句的概念及其用法,例句(不断更新)

主语从句的原理 主语从句是一种充当整个句子主语的从句&#xff0c;主语从句构成的句子&#xff0c;是要以引导词开头的。它可以用名词性从属连词、关系代词或关系副词引导。主语从句通常位于谓语动词之前&#xff0c;用于表示动作、状态或事件的主体。 以下是一些常用的引导主…...

数组的子数组(亚阵列)、子序列,字符串的子串、子序列

数组 子数组 一个或连续多个数组中的元素组成一个子数组 子数组最少包含一个元素 数组 {1, 2, 3} 的子数组是 {1}, {1, 2}, {1, 2, 3}, {2}, {2, 3}&#xff0c; 和 {3}. 子序列 子序列就是在原来序列中找出一部分组成的序列 子序列不一定连续 相对位置还是不变 但是&#xff…...

MySQL 知识:迁移数据目录到其他路径

一、系统环境 操作系统&#xff1a;Centos 7 已安装环境&#xff1a;MySQL 8.0.26 二、开始操作 2.1 关闭SELinux 为了提高 Linux 系统的安全性&#xff0c;在 Linux 上通常会使用 SELinux 或 AppArmor 实现强制访问控制&#xff08;Mandatory Access Control MAC&#xff…...

Go | 一分钟掌握Go | 8 - 并发

作者&#xff1a;Mars酱 声明&#xff1a;本文章由Mars酱编写&#xff0c;部分内容来源于网络&#xff0c;如有疑问请联系本人。 转载&#xff1a;欢迎转载&#xff0c;转载前先请联系我&#xff01; 前言 当今编程界&#xff0c;一个好的编译型语言如果不支持并发&#xff0c…...

【滤波】多元高斯

本文主要翻译自rlabbe/Kalman-and-Bayesian-Filters-in-Python的第5章节05-Multivariate-Gaussians&#xff08;多元高斯&#xff09;。 %matplotlib inline#format the book import book_format book_format.set_style()简介 上一篇文章中的技术非常强大&#xff0c;但它们只…...

单源最短路问题

全部代码 全部代码在github acwing 上 正在更新 https://github.com/stolendance/acwing 图论 欢迎大家star与fork 单源最短路问题 先用spfa算法 不行再换其他的 spfa-超级万能 说不定比dijsktra还快 dis[] 代表第k到某一点的最短距离 queue 代表刚被更新的点 它有可能更…...

浏览器访问 AWS ECS 上部署的 Docker 容器(监听 80 端口)

✅ 一、ECS 服务配置 Dockerfile 确保监听 80 端口 EXPOSE 80 CMD ["nginx", "-g", "daemon off;"]或 EXPOSE 80 CMD ["python3", "-m", "http.server", "80"]任务定义&#xff08;Task Definition&…...

web vue 项目 Docker化部署

Web 项目 Docker 化部署详细教程 目录 Web 项目 Docker 化部署概述Dockerfile 详解 构建阶段生产阶段 构建和运行 Docker 镜像 1. Web 项目 Docker 化部署概述 Docker 化部署的主要步骤分为以下几个阶段&#xff1a; 构建阶段&#xff08;Build Stage&#xff09;&#xff1a…...

汇编常见指令

汇编常见指令 一、数据传送指令 指令功能示例说明MOV数据传送MOV EAX, 10将立即数 10 送入 EAXMOV [EBX], EAX将 EAX 值存入 EBX 指向的内存LEA加载有效地址LEA EAX, [EBX4]将 EBX4 的地址存入 EAX&#xff08;不访问内存&#xff09;XCHG交换数据XCHG EAX, EBX交换 EAX 和 EB…...

DeepSeek 技术赋能无人农场协同作业:用 AI 重构农田管理 “神经网”

目录 一、引言二、DeepSeek 技术大揭秘2.1 核心架构解析2.2 关键技术剖析 三、智能农业无人农场协同作业现状3.1 发展现状概述3.2 协同作业模式介绍 四、DeepSeek 的 “农场奇妙游”4.1 数据处理与分析4.2 作物生长监测与预测4.3 病虫害防治4.4 农机协同作业调度 五、实际案例大…...

大语言模型(LLM)中的KV缓存压缩与动态稀疏注意力机制设计

随着大语言模型&#xff08;LLM&#xff09;参数规模的增长&#xff0c;推理阶段的内存占用和计算复杂度成为核心挑战。传统注意力机制的计算复杂度随序列长度呈二次方增长&#xff0c;而KV缓存的内存消耗可能高达数十GB&#xff08;例如Llama2-7B处理100K token时需50GB内存&a…...

Linux 中如何提取压缩文件 ?

Linux 是一种流行的开源操作系统&#xff0c;它提供了许多工具来管理、压缩和解压缩文件。压缩文件有助于节省存储空间&#xff0c;使数据传输更快。本指南将向您展示如何在 Linux 中提取不同类型的压缩文件。 1. Unpacking ZIP Files ZIP 文件是非常常见的&#xff0c;要在 …...

华为OD机考-机房布局

import java.util.*;public class DemoTest5 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseSystem.out.println(solve(in.nextLine()));}}priv…...

jmeter聚合报告中参数详解

sample、average、min、max、90%line、95%line,99%line、Error错误率、吞吐量Thoughput、KB/sec每秒传输的数据量 sample&#xff08;样本数&#xff09; 表示测试中发送的请求数量&#xff0c;即测试执行了多少次请求。 单位&#xff0c;以个或者次数表示。 示例&#xff1a;…...

给网站添加live2d看板娘

给网站添加live2d看板娘 参考文献&#xff1a; stevenjoezhang/live2d-widget: 把萌萌哒的看板娘抱回家 (ノ≧∇≦)ノ | Live2D widget for web platformEikanya/Live2d-model: Live2d model collectionzenghongtu/live2d-model-assets 前言 网站环境如下&#xff0c;文章也主…...

MySQL 主从同步异常处理

阅读原文&#xff1a;https://www.xiaozaoshu.top/articles/mysql-m-s-update-pk MySQL 做双主&#xff0c;遇到的这个错误&#xff1a; Could not execute Update_rows event on table ... Error_code: 1032是 MySQL 主从复制时的经典错误之一&#xff0c;通常表示&#xff…...