从零开始搭建React+TypeScript+webpack开发环境-自定义配置化的模拟服务器
技术栈
我们将使用Node.js和Express.js作为我们的后端框架,以及Node.js的文件系统(fs)模块来操作文件和文件夹。此外,我们将使用Node.js的require和delete require.cache来加载和更新模拟数据。
项目结构
首先,让我们定义一个简单的项目结构:
- your-project/- mock/- api/- users.json- other/- products.json- server.js
在mock文件夹中,我们可以为不同的API接口创建不同的子文件夹,并在每个子文件夹中放置相应的JSON文件,以模拟不同的数据。然后,我们将在server.js文件中创建我们的配置化的模拟服务器。
代码示例
const path = require('path');
const fs = require('fs');
const express = require('express');function watchMockFiles(mockDirectory, mockData) {function watchDirectory(directory) {fs.watch(directory, (eventType, filename) => {if (filename.endsWith('.json')) {const mockPath = path.join(directory, filename);const mockKey = path.relative(mockDirectory, mockPath).replace('.json', '').replace(/\\/g, '/');delete require.cache[require.resolve(mockPath)];const jsonData = require(mockPath);mockData[mockKey] = jsonData;console.log(`Updated mock data for ${mockKey}`);}});fs.readdirSync(directory).forEach((file) => {const fullPath = path.join(directory, file);const stats = fs.statSync(fullPath);if (stats.isDirectory()) {watchDirectory(fullPath);}});}watchDirectory(mockDirectory);
}function readMockFiles(mockDirectory) {const mockData = {};function traverse(directory) {const files = fs.readdirSync(directory);files.forEach((file) => {const fullPath = path.join(directory, file);const stats = fs.statSync(fullPath);if (stats.isDirectory()) {traverse(fullPath);} else if (file.endsWith('.json')) {const mockKey = path.relative(mockDirectory, fullPath).replace('.json', '').replace(/\\/g, '/');const jsonData = require(fullPath);mockData[mockKey] = jsonData;}});}traverse(mockDirectory);return mockData;
}function configureMockDevServer({mockDirectory = path.resolve(__dirname, 'mock'),defaultResponseTime = 2000,
}) {const mockData = readMockFiles(mockDirectory);watchMockFiles(mockDirectory, mockData);const app = express();app.use('/api', (req, res) => {const url = req.originalUrl;const mockKey = url.replace('/api/', '');if (mockData[mockKey]) {const { responseTime = defaultResponseTime, statusCode = 200 } = mockData[mockKey];setTimeout(() => {res.status(statusCode).json(mockData[mockKey].data);}, responseTime);} else {res.status(404).json({ error: 'Mock data not found' });}});const port = 3000;app.listen(port, () => {console.log(`Mock server is running on port ${port}`);});
}configureMockDevServer();
在上面的示例中,我们创建了一个配置化的模拟服务器。它递归遍历mock文件夹和子文件夹,监视JSON文件的更改,支持不同的响应时间和HTTP响应码,并通过Express.js提供API接口。
使用示例
要使用这个配置化的模拟服务器,只需运行server.js文件。它将在端口3000上启动服务器,可以通过访问http://localhost:3000/api/{mockKey}来模拟API请求,其中{mockKey}是JSON文件的相对路径。
例如,要获取users.json文件的数据,可以访问http://localhost:3000/api/users。你还可以为每个API接口配置不同的响应时间和HTTP响应码,以满足你的需求。
结语
创建一个配置化的模拟服务器是一个有用的工具,可以帮助前
端开发人员模拟不同的API请求,并为每个接口配置不同的响应时间和HTTP响应码。这个方案可以提高开发和测试效率,同时提供更多的控制和灵活性。
相关文章:
从零开始搭建React+TypeScript+webpack开发环境-自定义配置化的模拟服务器
技术栈 我们将使用Node.js和Express.js作为我们的后端框架,以及Node.js的文件系统(fs)模块来操作文件和文件夹。此外,我们将使用Node.js的require和delete require.cache来加载和更新模拟数据。 项目结构 首先,让我们定义一个简单的项目结…...
python 之字典的相关知识
文章目录 字典的基本特点:1. 定义2. 键唯一性3. 可变性4. 键的类型 基本操作:字典的创建1. 花括号 {}2. dict() 构造函数3. 键值对的 dict() 构造函数使用 zip() 函数创建字典:注意事项访问字典中的值修改和添加键值对删除键值对 字典方法&am…...
上下游系统对接的沟通与协作
在工作中,有时会有对接其他部门系统的需求,这种需求虽然不复杂,但是跨部门协作,往往会出现各种难以沟通、协调的情况。 踩的坑多了,就记录下来。 注意:在本文中,A系统调用B系统,A依…...
pytest 的使用===谨记
发现用例的规则 a) 文件test_.py开头和_test.py结尾 b) Test开头的类中test开头的方法(测试类不能带有__init__方法) c) 模块中test开头的函数(可以不在class中) 注意点: pytest是以方法为单位发现用例的,你…...
Qt 4.8.6 的下载与安装
Qt 4.8.6 的下载与安装 Qt 4.8.6 的下载与安装下载并解压 MinGW 4.8.2Qt4.8.6 库的安装Qt Creator 3.3.0 的安装配置 Qt Creator测试 官方博客:https://www.yafeilinux.com/ Qt开源社区:https://www.qter.org/ Qt 4.8.6 的下载与安装 学习《Qt Creato…...
图形推理 | 判断推理
文章目录 一、位置规律二、样式规律三、属性规律四、数量规律 一、位置规律 平移 方向:直线(上下、左右、斜对角线)、绕圈(顺逆时针)常见步数:恒定、递增(等差) 旋转 方向ÿ…...
npm的使用
package.json 快速生成package.json npm init -y “version”: “~1.1.0” 格式为:「主版本号. 次版本号. 修订号」。 修改主版本号是做了大的功能性的改动 修改次版本号是新增了新功能 修改修订号就是修复了一些bug dependencies "dependencies": {&…...
Web服务器实战
网站需求 1.基于域名www.openlab.com可以访问网站内容为 welcome to openlab!!! 2.给该公司创建三个网站目录分别显示学生信息,教学资料和缴费网站,基于www.openlab.com/student 网站访问学生信息,www.openlab.com/data网站访问教学资料 www…...
2021年电工杯数学建模B题光伏建筑一体化板块指数发展趋势分析及预测求解全过程论文及程序
2021年电工杯数学建模 B题 光伏建筑一体化板块指数发展趋势分析及预测 原题再现: 国家《第十四个五年规划和 2035 年远景目标纲要》中提出,将 2030 年实现“碳达峰”与 2060 年实现“碳中和”作为我国应对全球气候变暖的一个重要远景目标。光伏建筑一体…...
pandas教程:Essential Functionality 索引 过滤 映射 排序
文章目录 5.2 Essential Functionality(主要功能)1 Reindexing(重新索引)2 Dropping Entries from an Axis (按轴删除记录)3 Indexing, Selection, and Filtering(索引,选择,过滤)Selection with loc and i…...
pyspark连接mysql数据库报错
使用pyspark连接mysql数据库代码如下 spark_conf SparkConf().setAppName("MyApp").setMaster("local")spark SparkSession.builder.config(confspark_conf).getOrCreate()url "jdbc:mysql://localhost:3306/test?useUnicodetrue&characterE…...
HK WEB3 MONTH Polkadot Hong Kong 火热报名中!
HK Web3 Month 11月除了香港金融科技周外,HK Web3 Month又是一大盛事,从10月29日开始开幕直到11月18日结束。此次将齐聚世界各地的Web3产业从业者、开发者、社群成员和学生来参与本次盛会。除外,超过75位产业知名的讲者与超过50场工作坊将为…...
“第六十三天”
这两天怎么做的这么别扭,为什么我的vs 的strlen函数包括终止字符了; 哦哦,明白了,fgets函数读取在未达到指定字长,或者遇见空白符之前,会读取前面的所有字符,所以会读取换行符,而get…...
常用排序算法实现
时间复杂度 O ( 1 ) O(1) O(1) void func1(int n){int count 100;count; } void func2(int n){int count 100;for(int i 0; i < count;i){} } int func3(int n){return n; }O ( n ) O(n) O(n) void func1(int n){int count 100;for(int i 0; i < n;i){count;} …...
使用表单登录方法模拟登录通信人家园,要求发送登录请求后打印出来的用户名下的用户组类别
目标网站:https://www.txrjy.com/forum.php 一、进入网页,右键“检查” 二、输入用户名和密码,点击“登录”,点击“Network”,上划加载项找到蓝色框中的内容 三、点击第一个加载项,找到URL 四、相关代码: …...
Redis 的缓存击穿,穿透,雪崩及其解决方案
1 缓存穿透 什么是缓存穿透? 大量请求的 key 是不合理的,根本不存在于缓存中,也不存在于数据库中 。导致这些请求直接到了数据库上,根本没有经过缓存这一层,对数据库造成了巨大的压力,可能直接就被这么多…...
JWT原理分析——JWT
了解为什么会有JWT的出现? 首先不得不提到一个知识叫做跨域身份验证,JWT的出现就是为了更好的解决这个问题,但是在没有JWT的时候,我们一般怎么做呢?一般使用Cookie和Session,流程大体如下所示:…...
Jprofiler/ VisualVM 定位内存溢出OOM
下载,接受协议下一步下一步,最后选择与IDEA集成OK ej-technologies - Java APM, Java Profiler, Java Installer Builder IDEA配置参数: # F:\study\spring-test\dump 为dump文件保存路径-XX:HeapDumpOnOutOfMemoryError -XX:HeapDumpPathF:\study\spring-test\dumppackage …...
NOIP2023模拟13联测34 competition
题目大意 有一场题目数量为 m m m的比赛,有一个团队想要来参加。 这个团队有 n n n个选手,编号为 i i i的选手能做第 l i ∼ r i l_i \sim r_i li∼ri道题,每题他都有 100 % 100\% 100%的概率做出来。 这个团队会随机派出一只队伍来参…...
Intel oneAPI笔记(2)--jupyter官方文档(oneAPI_Intro)学习笔记
前言 本文是对jupyterlab中oneAPI_Essentials/01_oneAPI_Intro文档的学习记录,包含对SYCL、DPC extends SYCL、oneAPI Programming models等介绍和SYCL代码的初步演示等内容 oneAPI编程模型综述 oneAPI编程模型提供了一个全面而统一的开发人员工具组合࿰…...
conda相比python好处
Conda 作为 Python 的环境和包管理工具,相比原生 Python 生态(如 pip 虚拟环境)有许多独特优势,尤其在多项目管理、依赖处理和跨平台兼容性等方面表现更优。以下是 Conda 的核心好处: 一、一站式环境管理:…...
微信小程序之bind和catch
这两个呢,都是绑定事件用的,具体使用有些小区别。 官方文档: 事件冒泡处理不同 bind:绑定的事件会向上冒泡,即触发当前组件的事件后,还会继续触发父组件的相同事件。例如,有一个子视图绑定了b…...
【力扣数据库知识手册笔记】索引
索引 索引的优缺点 优点1. 通过创建唯一性索引,可以保证数据库表中每一行数据的唯一性。2. 可以加快数据的检索速度(创建索引的主要原因)。3. 可以加速表和表之间的连接,实现数据的参考完整性。4. 可以在查询过程中,…...
基于ASP.NET+ SQL Server实现(Web)医院信息管理系统
医院信息管理系统 1. 课程设计内容 在 visual studio 2017 平台上,开发一个“医院信息管理系统”Web 程序。 2. 课程设计目的 综合运用 c#.net 知识,在 vs 2017 平台上,进行 ASP.NET 应用程序和简易网站的开发;初步熟悉开发一…...
23-Oracle 23 ai 区块链表(Blockchain Table)
小伙伴有没有在金融强合规的领域中遇见,必须要保持数据不可变,管理员都无法修改和留痕的要求。比如医疗的电子病历中,影像检查检验结果不可篡改行的,药品追溯过程中数据只可插入无法删除的特性需求;登录日志、修改日志…...
Debian系统简介
目录 Debian系统介绍 Debian版本介绍 Debian软件源介绍 软件包管理工具dpkg dpkg核心指令详解 安装软件包 卸载软件包 查询软件包状态 验证软件包完整性 手动处理依赖关系 dpkg vs apt Debian系统介绍 Debian 和 Ubuntu 都是基于 Debian内核 的 Linux 发行版ÿ…...
大数据零基础学习day1之环境准备和大数据初步理解
学习大数据会使用到多台Linux服务器。 一、环境准备 1、VMware 基于VMware构建Linux虚拟机 是大数据从业者或者IT从业者的必备技能之一也是成本低廉的方案 所以VMware虚拟机方案是必须要学习的。 (1)设置网关 打开VMware虚拟机,点击编辑…...
Leetcode 3577. Count the Number of Computer Unlocking Permutations
Leetcode 3577. Count the Number of Computer Unlocking Permutations 1. 解题思路2. 代码实现 题目链接:3577. Count the Number of Computer Unlocking Permutations 1. 解题思路 这一题其实就是一个脑筋急转弯,要想要能够将所有的电脑解锁&#x…...
OkHttp 中实现断点续传 demo
在 OkHttp 中实现断点续传主要通过以下步骤完成,核心是利用 HTTP 协议的 Range 请求头指定下载范围: 实现原理 Range 请求头:向服务器请求文件的特定字节范围(如 Range: bytes1024-) 本地文件记录:保存已…...
微信小程序云开发平台MySQL的连接方式
注:微信小程序云开发平台指的是腾讯云开发 先给结论:微信小程序云开发平台的MySQL,无法通过获取数据库连接信息的方式进行连接,连接只能通过云开发的SDK连接,具体要参考官方文档: 为什么? 因为…...
