共计 1502 个字符,预计需要花费 4 分钟才能阅读完成。
APIPOST 能够让你在没有后端程序的状况下能实在地返回接口数据,你能够用 APIPOST 实现我的项目初期纯前端的成果演示,也能够用 APIPOST 实现开发中的数据模仿从而实现前后端拆散。在应用 APIPOST 之前,你的团队实现数据模仿可能是上面的计划中的一种或者多种:
- 本地手写数据模仿,在前端代码中产生一大堆的 mock 代码。
- 利用 mockjs 或者 canjs 的 can-fixture 实现 ajax 拦挡,本地配置必要的 json 规定。
- 后端在 Controller 层造假数据返回给前端。
下面的形式中,不论哪一种形式,都会要求开发人员写一些跟我的项目本无任何关联的代码,第一个和第二个形式还会须要前端我的项目在本地引入不必要的 js 文件。
应用 APIPOST 的 Mock 服务
您能够通过 APIPOST 提供的 Mock 服务实现上述性能。
编写 Mock 规定
在 APIPOST 中,Mock 规定模板反对类型丰盛(5.4 版本起)。
根本数据 (固定 json 构造)
{
"code": "0",
"data": {
"name": "张三丰",
"age": 100
},
"desc": "胜利"
}
根本数据 (Mock 随机 json 构造)
{
"code": "0",
"data": {
"list|20": [{
"name": "@name",
"age": "@integer(2)"
}],
"url": "https://echo.apipost.cn"
},
"desc": "胜利"
}
RESTFUL 逻辑数据
某些场景中,咱们可能须要依据接口的入参规定,退出适当的逻辑解决后再返回数据。一个简略的场景就是登录场景,须要依据用户名明码,判断是否登录胜利。再或者,咱们须要依据产品 ID 动静返回产品信息,等等。
当初,ApiPost 的 Mock 服务提供了这种场景的解决方案。
以下示例中,咱们用到了 _req.body 对象,其含意是:
当 post 申请以 x-www-form-urlencoded 或者 application/json 形式提交时,咱们能够拿到申请的参数对象。
{
"code": "0000",
"data": {"verifySuccess": function() {
let body = _req.body;
return body.username === 'admin' && body.password === '123456';
},
"userInfo": function() {
let body = _req.body;
if (body.username === 'admin' && body.password === '123456') {
return Mock.mock({
username: "admin",
email: "@email",
address: "@address"
});
} else {return null;}
},
},
"desc": "胜利"
}
填写 Mock URL 绝对地址
Mock URL 绝对地址是必填项(如果不填写的话,无奈失常失去响应后果)。您能够通过在设置里开启“主动获取 Mock URL 地址”来主动获取 Mock URL。
此项开启后,APIPOST 将依据您输出的接口 URL 主动截取 PATH 局部作为 Mock URL 的相对路径。
利用 APIPOST 发送 Mock URL
实现以上 2 步后,您能够通过在 APIPOST 中切换到“Mock 环境”来发送查看 mock 返回的具体数据。
将生成的 mock URL 地址发给前端
您能够将 APIPOST 生成的 mock URL 地址发给前端来代替您的接口地址,这样前端就能够应用您模仿的数据进行先一步的调试开发了。当您的接口实现后,再替换回来即可。
APIPOST 的 mock 是基于 mock.js 开发的。具体文档能够 参见 mock.js 具体文档。