fastmock使用

news2024/9/20 18:54:45

        FastMock 是一个在线工具,用于快速创建和管理模拟 API(Mock API)。它主要用于前端开发,允许开发者在没有真实后端服务的情况下,模拟 API 响应,从而加速开发和测试过程。

        FastMock网址:fastmock.site/#/

        FastMock 的使用方法相对简单,基本有以下步骤:

1、创建项目


进入网站登录后,点击“创建项目”按钮。


输入项目名称和描述,如果有的话,可以选择合适的模板。


2、定义接口
        在项目中,点击“添加接口”。输入接口的名称、请求方式(GET、POST等)和请求路径。在“返回数据”部分,定义你希望返回的 JSON 数据结构。


3、测试接口
创建接口后,可以直接在 FastMock 的界面中测试接口。点击接口名称,查看接口详情,并使用提供的测试工具发送请求。

4、集成到前端项目
将 FastMock 提供的接口 URL 集成到你的前端项目中。例如,在 Axios 请求中使用 FastMock 的 URL 进行数据请求。

    const getTableList = async ()=>{
      await axios
      .get(
        "https://www.fastmock.site/mock/e98d3ea2f4ce5e0e5f85c638ab745984/lost-mockData/home/getTableData"
        )
      .then((res)=>{
        //二次封装axios
        console.log(res);
        // tableData.value=res.data.data.tableData;
        
        if(res.data.code == 200){
          tableData.value=res.data.data;
        }

      });
      let res = await proxy.$api.getTableData();
      tableData.value=res
    };
    获取失物招领数据
    const getLostData =async () =>{
      let res=await proxy.$api.getLostData();
      lostData.value = res;
      // console.log(res);
    };


5、实时更新
你可以随时返回到接口定义页面,修改返回数据,实时更新接口的响应。
示例
假设你创建了一个用户信息的接口:

请求方式: GET
请求路径: /api/user
返回数据:

{  
  "id": 1,  
  "name": "John Doe",  
  "email": "john@example.com"  
}  


在前端代码中,你可以这样请求:

axios.get('https://your-fastmock-url/api/user')  
  .then(response => {  
    console.log(response.data);  
  });  


6、注意事项
确保在开发过程中使用正确的 FastMock URL。
定期检查和更新接口定义,以确保与前端需求一致。

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

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

相关文章

Java多进程调用dll程序和exe程序

🎯导读:本文介绍了使用Java调用本地DLL及EXE程序的方法。针对DLL调用,文章提供了基于Java Native Access (JNA) 库的具体实现方案,包括定义Java接口以映射DLL中的函数,并展示了如何加载DLL及调用其中的方法。对于EXE程…

Python 数据可视化:工具与实践

文章目录 数据可视化可视化库特点对比实例:绘制基本数据分布图评估维度 交互式可视化与静态图表实例:创建交互式折线图评估维度 实时数据可视化实例:展示实时股票数据评估维度 图表设计原则实例:设计适合展示销售数据的条形图评估…

论文辅助笔记:LP_BERT

1 train_task1.py 1.1 main部分 读取命令行参数,调用task1函数 1.2 task1 train 1.3 task1 valid 1.3 collate_fn 2 Dataset 2.1 train dataset 2.2 valid dataset 3 LPBERT 3.1 不同的embedding day-of-week embedding和time-of-day embedding X位置和Y位置的…

色彩与笔触的交响:广州米塔在线科教技术有限公司揭秘PS绘画秘籍!

在数字艺术的广阔天地里,PS无疑是一颗璀璨的明星,它不仅在图像处理领域独领风骚,更以其强大的功能成为了众多艺术家和设计师进行数字绘画的首选工具。广州米塔在线科教技术有限公司,作为致力于艺术教育与技术分享的平台,深知掌握P…

sealos快速搭建k8s集群

一,环境准备 1,三台(搭建一主两从集群)或五台(三主两从集群)虚拟机, 安装alimaLinux系统 ,相同的root密码,不要安装docker。 如果是alimaLinux-mini版本操作系统&#xf…

PMP–知识卡片--SCQA金字塔表达

SCQA模型通过四个关键元素:情景冲突疑问答案,建立了一个精确而有逻辑的表达框架。同时,它也能够帮助你构建合理的逻辑链条,让别人更容易理解和接受你的观点。 情景:通过描述背景和现状引入话题,这个元素帮助…

两个月冲刺软考——关系模式中的候选关键字与如何分解为无损连接并保持函数依赖的解法(例题讲解,看完必会)

1. 数据库中的简单属性、多值属性、复合属性、派生属性 简单属性:指不能够再分解成更小部分的属性,通常是数据表中的一个列。例如学生表中的“学号”、“姓名”等均为简单属性。 多值属性:指一个属性可以有多个值。例如一个学生可能会有多个…

掌握EF Core:全方位面试指南,助你从初级到高级轻松晋级

一、前言 这份指南旨在帮助你为主要考察 Entity Framework Core (EF Core) 的面试做好准备,内容涵盖基础、中级和高级三个不同经验级别。每个级别包括10个高频面试题,附有解题思路和详细的解答示例。 二、基础级别 重点在于 EF Core 的基本概念和使用…

nginx源码编译

华子目录 准备下载nginx源码包关闭firewalld和selinux安装依赖环境 安装解压关闭nginx的debug功能执行./configure进行环境检测添加nginx系统用户使用make编译使用make install安装 进入到prefix指定的目录中查看启动nginx服务关闭nginx添加nginx环境变量卸载nginx 准备 下载n…

猫头虎 分享:Python库 SciPy 的简介、安装、用法详解入门教程

🐯 猫头虎 分享:Python库 SciPy 的简介、安装、用法详解入门教程 今天猫头虎带您深入探索SciPy,一个在数据科学和人工智能领域必不可少的Python库! 📝 摘要 在数据科学和人工智能领域,SciPy 是一个关键的…

【电脑小白】告别蓝屏恐慌:一步步教你排查和解决蓝屏问题,从此告别蓝屏烦恼!

在日常学习和工作中,电脑已经成为我们日常生活和工作中不可或缺的一部分。然而,电脑的蓝屏问题却成为许多朋友,尤其是电脑小白们的噩梦。一旦遭遇蓝屏,大多数人一时都会感到手足无措。 因此,本文将向各位朋友介绍遇到蓝…

迁移学习之领域泛化

对目标领域一无所知,并不是要适应到某一个特定的领域上的问题通常称为领域泛化。领 域泛化可又分成两种情况。一种情况是训练数据非常丰富,包含了各种不同的领域,测试数据 只有一个领域。如图1(a)所示,比如…

2024年8月30日(docker部署project-exam-system系统 并用Dockerfile构建java镜像)

一、回顾 1.使用harbao仓库 1. Python -- version 2. yum -y update 3. yum -y install python2-pip 4. pip install -- upgrade pip 20.3 -i https://mirrors.aliyun.com/pypi/simple 5. pip install docker-compose -i https://mirrors.aliyun.com/pypi/simple 6. source do…

向量、数量积、向量积

目录 一、向量的定义二、向量是有序的数字列表三、向量的基本分类四、向量的运算律五、向量的基本运算1、向量加法2、向量乘法(数乘)3、向量减法4、点积(内积或数量积)5、叉积(外积或向量积)6、向量的模&am…

RTA-OS Port Guide学习(一)-基于S32K324 OS

文章目录 前言OS Port的安装Port CharacteristicsParameters of ImplementationConfiguration ParametersStack used for C-startup(SpPreStartOS)Stack used when idle (SpStartOS)Stack overheads for ISR activation (SpIDisp)Stack overheads for ECC tasks (SpECC)Stack o…

LLM的范式转移:RL带来新的 Scaling Law

从几周前 Sam Altman 在 X 上发布草莓照片开始,整个行业都在期待 OpenAI 发布新模型。根据 The information 的报道,Strawberry 就是之前的 Q-star,其合成数据的方法会大幅提升 LLM 的智能推理能力,尤其体现在数学解题、解字谜、代…

<Rust>egui学习之小部件(三):如何为窗口UI元件设置布局(间隔、水平、垂直排列)?

前言 本专栏是关于Rust的GUI库egui的部件讲解及应用实例分析,主要讲解egui的源代码、部件属性、如何应用。 环境配置 系统:windows 平台:visual studio code 语言:rust 库:egui、eframe 概述 本文是本专栏的第三篇博…

TWRP 使用帮助 第三方Recovery

简介 TWRP 是国外安卓爱好者开发的一款工具全称为:Team Win Recovery Project。是一个由Omnirom开源团队中的Dees Troy主导开发,旨在打造最完美第三方recovery的开源项目。目前主要由包括Dees Troy在内的4个人共同维护。 主要作用包括刷机、备份、救砖 …

C++判断语句(基础速通)ac-wing

倍数 #include <iostream> using namespace std; int a, b; int main() {cin >> a >> b;if (a % b 0 || b % a 0) cout << "Sao Multiplos";else cout << "Nao sao Multiplos";return 0; }零食 #include <iostream>…

通用后台管理系统实战演示(Vue3 + element-plus)汇总篇一

天行健&#xff0c;君子以自强不息&#xff1b;地势坤&#xff0c;君子以厚德载物。 每个人都有惰性&#xff0c;但不断学习是好好生活的根本&#xff0c;共勉&#xff01; 文章均为学习整理笔记&#xff0c;分享记录为主&#xff0c;如有错误请指正&#xff0c;共同学习进步。…