前端必备,5大mock省时提效小tips,用了提前下班一小时
一.一些为难前端的业务场景
在我的工作经历里,需要等待后端童鞋配合我的情形大概有以下几种:
a.我们跟外部有项目合作,需要调用到第三方接口。
一般这种情况下,商务那边谈合同,走流程,等第三方审核,我们这边会直接开始开发,而这个时候还没有外部接口可以使用;或者是合同都谈妥了,但是第三方对接的工作人员排期还没有排到。总之是需要等。
b.活动抢节点上线
一个比较赶时间节点(如七夕,双十一)的活动需求下来,前后端同时开发,后端还没有开发完接口可以调试。
c.需要调用的接口很复杂。
本来我只需要一个简单的返回,但因为各种历史原因和业务分割等原因需要间接调用N个不同的复杂接口,导致这部分工作量非常大耗费时间很多,但又没有很大的价值。
这个时候我就偏向于选择mock,联调时就做得粗糙一点,然后等进入测试阶段,让测试同学给我暴露问题(测试童鞋请原谅我偷懒hahah)
现在给前端mock的软件也有很多,大家自己挑自己合适的就好。
其实mock工具都满足的需求都大同小异,关键在于能够模拟出一些业务场景里面具体的细节,细节减少你在重复的事情上花费的时间。
我个人现在用的是apifox(www.apifox.cn),比较起来优点是它能仿造出比较逼真的业务数据,我不用再去二次调整。
细节上节省的时间每天要是仔细去算,也有一两个小时的,省下来就是能提前下班的时长。
我这里只写一些我尝试过的在Apifox上mock数据的省时小技巧。
二.省时提效小tips
tips1:常用的返回参数封装成一个数据模型,用到直接填。
比如一个音乐软件,最常用到的返回数据可能是歌手数据和歌曲数据。
歌手数据包括:歌手头像,歌手姓名,性别,热门歌曲50首等信息;
歌曲数据包括:歌曲名称,大小,歌曲链接,专辑封面,所属歌手,歌词文件等信息。
如果每次设置返回值都需要重复设置上述字段,那么麻烦又耗时。
这时候可以将常用参数分别封装成一个数据类型,填返回值的时候直接填进去,这样接口返回就能返回相应的字段了。
tips2:数据采用高仿真数据,避免数据类型和显示的相关bug
之前我自己造假数据有时候会忽略了格式,只填数字或随便打几个中文字符填充,这样容易产生不必要的错误。
一是返回的数据会有格式校验,不符合的会报错,这时再回头修改浪费了时间;
二是不符合数据结构的展示也可能会出异常,如果后续还要用这个数据进行处理也会阻碍程序的正常运行。
别的软件没怎么细用我没法详细展开说。如果大家是用apifox这个软件来mock数据的话,它在返回数据类型那里提供了很多常用的数据类型以供填充。
大家在造数据时可以根据自己的业务类型造出更仿真的数据出来。
造数据实际上很麻烦又费时间。普通的如中文姓名的还好说,如果要造URL,邮编,16进制色值,域名,身份证号我经常得去检索一下数据规则才能造。
一般我是在这个软件填完返回参数后再进一步选择某类数据,apifox会自动生成符合相应数据结构要求的数据出来。
它可以支持基础的文本,身份证,ip地址,url这类数据也能仿造出来。
举个例子:我在返回值中分别设置了下列数据类型:
返回值数据如下,出来的是能用的“真”数据了。
tips3:边界场景给接口“打暗号”调试
apifox提供了一个高级mock功能:当用户在请求参数中填写的值符合特定的条件的时候,接口会返回特定的值。
我一般用这个功能来做边界场景的测试,比如说设置请求参数的值为none让接口返回空值;或者测试某个字段在各种长度下UI的表现是否正常。
tips4:错误码使用枚举类型,调试异常场景的兼容
另外有时候我们前端需要对后端返回的错误码进行兼容处理或者给到用户相关提示。
调试这个功能的时候我有一个比较取巧的方式是利用response参数设置里的高级设置。
将错误码以枚举值的形式填进去。测试当后端返回不同的错误码类型时,前端是否有相应的反馈。
tips5:有业务约束的设置更精准的返回值
在mock数据上,除了数据类型本身的约束,还存在着业务约束。
有时候虽然返回的数据类型是我们要的,符合数据格式了,但还可能不符合我们实际的业务场景。
举例:某个曲库里只有50000张album,但album返回值设置了integer,导致每次返回可能会超出曲库ID上限而返回异常值。但我是需要返回的东西来执行进一步操作的,我需要它正常返回。
此时可进入高级设置,设置好返回值的数值范围,从而使得返回的数据能符合我们的调试要求。
这些虽然是很小的功能点,但确实在实际业务里能给大家节省掉不少时间。
目前apifox这个软件我只用了mock功能,所以就先分享这么多,后续有其他可以提高效率省时省力的小tips我再分享给大家。
如果想下载的话可以直接去他们官网www.apifox.cn,软件目前还是免费的,直接下载就能用了。
前端必备,5大mock省时提效小tips,用了提前下班一小时的更多相关文章
- python提效小工具-统计xmind用例数量
问题:做测试的朋友们经常会用到xmind这个工具来梳理测试点或写测试用例,但是xmind8没有自带的统计测试用例,其他版本的xmind有些自带节点数量统计功能,但也也不会累计最终的数量,导致统计测试工 ...
- 006_饿了么大前端总监sofish帮你理清前端工程师及大前端团队的成长问题!
作者|Sofish编辑|小智 & 尾尾本文是前端之巅向 sofish 的约稿<什么样的人可以称为架构师?>.采访< 饿了么大前端团队究竟是如何落地和管理的?>以及 so ...
- 前端必备HTTP技能之HTTP请求头响应头中常用字段详解(转)
作为一名前端开发人员,肯定少不了要和网络打交道,因为要从服务器端拉取数据,从服务端获取数据最常用的方式还是通过HTTP请求.给服务器发请求的时候有请求头,接受服务器响应的时候有响应头,客户端和服务器端 ...
- 前端,Java,产品经理,微信小程序,Python等资源合集大放送
为了感恩大家长久以来的关注和支持,小编准备了一些福利,整理了包含前端,Java,产品经理,微信小程序,Python,网站源码,Android应用视频教程,微信公众平台开发教程及材料等资源合集大放送. ...
- 阿里巴巴如何进行测试提效 | 阿里巴巴DevOps实践指南
编者按:本文源自阿里云云效团队出品的<阿里巴巴DevOps实践指南>,扫描上方二维码或前往:https://developer.aliyun.com/topic/devops,下载完整版电 ...
- 前端必备:FastStoneCapture 和 Licecap
前端必备:FastStoneCapture 和 Licecap FastStoneCapture这个软件非常小,只有2M多,并且其功能很强大,包括截图,录制视频,量尺,取色等等,对于前端工程师绝对是必 ...
- webpack入门--前端必备
webpack入门--前端必备 什么是 webpack? webpack是一款模块加载器兼打包工具,它能把各种资源,例如JS(含JSX).coffee.样式(含less/sass).图片等都作为模块来 ...
- Sublime编辑器 前端 必备插件
sublime编辑器前端必备插件 下面这一行是Package Control包安装,它是sublime的插件包管理器.新安装的sublime 里没有Package Control,按一下ctrl+~, ...
- 极客Web前端开发资源大荟萃
前端开发已经成为当前炙手可热的技术之中的一个.本周我们除了给大家带技术相关资讯,另一些技术人员经常使用的站点.希望大家不要错过我们本周的内容.原文来自:极客标签 为神马说敲代码是非常艰难的 程序猿 做 ...
随机推荐
- JDBC(2):JDBC对数据库进行CRUD
一. statement对象 JDBC程序中的Connection用于代表数据库的链接:Statement对象用于向数据库发送SQL语句:ResultSet用于代表Sql语句的执行结果 JDBC中的s ...
- entfrm开发平台,一个免费开源可视化的无代码开发平台
简介 entfrm开发平台,是一个以模块化为核心的无代码开发平台,是一个集PC和APP快速开发.系统管理.运维监控.开发工具.OAuth2授权.可视化数据源管理与数据构建.API动态生成与统计.工作流 ...
- Linux:expr、let、for、while、until、shift、if、case、break、continue、函数、select
1.expr计算整数变量值 格式 :expr arg 例子:计算(2+3)×4的值 1.分步计算,即先计算2+3,再对其和乘4 s=`expr 2 + 3` expr $s \* 4 2.一步完成计算 ...
- Spring Boot下使用JSP页面
一.创建webapp目录 在src/main下创建webapp目录,用于存放jsp文件.这就是一个普通的目录,无需执行Mark Directory As 二.创建jsp 1.指定web资源目录 在sp ...
- 【科研工具】CAJViewer的一些操作
逐渐发现CAJViewer没有想象中的难用. 添加书签:Ctrl+M 使用按类分类,可以筛选出书签位置,和注释区分. 搜索:Ctrl+F 可以定义多种搜索.
- 什么是内容分发CDN
一.简介 CDN全称:Content Delivery Network或Content Ddistribute Network,即内容分发网络 基本思路: 尽可能避开互联网上有可能影响数据传输速度和稳 ...
- 纯css设置元素高度与宽度相等
设置图片高度等于宽度 .img-box{ width:100%; height:0; position: relative; padding-bottom: 100% } .img-box img{ ...
- 资源分配(Project)
<Project2016 企业项目管理实践>张会斌 董方好 编著 资源设置好以后,不能光摆着看,分配到各任务中去才是正道. 分配资源就需要回到与任务相关的视图了,比如[任务工作表]视图或者 ...
- LuoguP7869 「Wdoi-4」使用三个系统程度的能力 题解
Content 现在有一个转换后的文本文件,以一个长度为 \(n\) 的字符串表示.请判断这个文件是用哪一种写的,详情请返回题面. 数据范围:\(n\leqslant 10^5\).字符串里面至少有一 ...
- WebApi的前端调用
WebApi前端调用 HTML代码: <!DOCTYPE html><html> <head> <meta charset="utf-8" ...