0
点赞
收藏
分享

微信扫一扫

在线接口Mock工具fastmock详解


在线接口Mock工具fastmock详解_mock工具

文章目录

  • ​​简介​​
  • ​​一、创建项目​​
  • ​​二、创建接口​​
  • ​​三、配置接口(重点)​​
  • ​​四、使用接口​​
  • ​​五、调用接口​​

简介

​​官网地址​​

简单好用的在线接口 MOCK 平台

  • 本地无需任何开发,讲请求根地址指向到模拟地址即可轻松实现接口模拟
  • 快速生成演示数据,只需要开发前端即可向客户演示真实效果

服务于前后端分离项目的接口 MOCK 平台

fastmock 让接口 mock 变得更加简单,让团队协作变得更加高效

  • fastmock 可以让你在没有后端程序的情况下能真实地在线模拟 ajax 请求,实现前后端分离
  • 用 fatmock 实现项目初期纯前端的效果演示,再也不必为演示而开发全套程序
  • 使用简单,只需简单的配置,将根地址指向到 fastmock ,即可实现数据模拟,无需额外开发

去掉一切繁琐,提取出最关键的功能,只需要 登录 => ​创建项目​ => ​创建接口​ => ​录入您想返回的数据​ 即可轻松创建一个接口。

一、创建项目

在官网注册登录后就可以开始​​创建项目​​了,如下图:

在线接口Mock工具fastmock详解_mock工具_02

二、创建接口

在刚刚新建的项目中点击​​创建接口​

在线接口Mock工具fastmock详解_mock工具_03

三、配置接口(重点)

​​官方常用返回规则示例(必看)​​

配置好相关接口,如下图:

在线接口Mock工具fastmock详解_fastmock_04


此处入参只有是username: 'admin' , password: '123456'才会返回​登录成功​

.

保存即可生效

在线接口Mock工具fastmock详解_mock工具_05

四、使用接口

在项目中使用:

// $axios的封装此处省略
$axios.post('https://www.fastmock.site/mock/0764b93cba70add273910b232c51aad8/development/api/login', data).then(res => {
if (res.code === 0) {
if (res.data.success) {
Message.success(res.data.msg);
commit('SET_TOKEN', res.data.token);
} else {
Message.error(res.data.msg);
}
resolve(res);
}
}).catch(error => {
reject(error);
})

五、调用接口

当入参是​​username: 'admin' , password: '123456'​​​时返回​​登录成功​​,如下图:

在线接口Mock工具fastmock详解_数据_06

在线接口Mock工具fastmock详解_fastmock_07


.当入参不匹配时则返回​​登录失败​​,如下图:

在线接口Mock工具fastmock详解_创建项目_08

是不是 so easy 啊 ~


举报

相关推荐

0 条评论