whistle自定义修改接口返回值内容

修改接口返回值内容是前端想要验证后续交互逻辑,但是又不想去找测试/后端造数时,常见的手段。

如果是在浏览器,我们可以很轻松的就修改接口的返回值内容,如下图的sugrec?&prod=pc_his&from=pc_web&json=1&imod=2 这个接口

我们只需要 单击选中 -> 右键 ->替换内容

之后如下图,我们就可以随心所欲的修改返回值的内容了,比如把我在CSDN的名称从'北北'改成'哈基米',ctrl+s保存。(这里的brower_override是我本地D盘自定义的一个文件夹,因为要把覆盖修改的返回值内容找个地方存起来,所以这里如果第一次修改返回值内容,可能还需要配置一下)

后面再一次刷新,就可以看到交互已经被正确修改展示

但是如果是安卓,IOS手机测试。不像浏览器那般容易mock接口返回值。

就可以使用whistle的mock功能。

whistle的下载和基础功能,可以参考其他文章,自定义返回值内容可以如下操作

1.先在Values里面定义一个json文件

2.再按照 要代理的接口 代理的内容的写法,把刚刚获取用户信息的接口代理到刚刚定义的userInfo.json文件上

3.使用zeroOmega,开启whistle代理环境(这里对于zeroOmega不熟悉的,可以参考其他文章或者询问AI,来知道该插件的功能是干嘛的)

展示成果:

1.这里发现接口成功被whistle代理了

2.同时我在whistle里mock的返回值也成功生效,并且能够影响浏览器前端的交互展示逻辑。

接口返回值内容成功通过whistle修改。


小总结:上述只是一个基础的演示,mock返回值在日常其他一些比较复杂的业务场景下走不同的逻辑分支是有挺大用处的,可以多尝试一下。

相关推荐
次次皮21 小时前
Linux 下通过 XShell 手动更新 Tomcat 应用并重启
前端·tomcat·jar
猫猫不是喵喵.21 小时前
Vue 3 项目创建指南:基于 Vue CLI 与 Vite 的两种方式
前端·javascript·vue.js
swipe21 小时前
14|(前端转全栈)商品详情高频访问怎么扛?Redis Cache Aside 实战
前端·后端·面试
swipe21 小时前
15|(前端转全栈)从一个副标题字段看懂后端完整交付链路
前端·后端·面试
卸任21 小时前
LocalTab:一个本地化、简洁且可定制的浏览器新标签页
前端·浏览器
间彧21 小时前
从火焰图到代码:如何揪出“用久必卡”的前端性能瓶颈
前端
米码收割机21 小时前
【前端】html_css 沐光公益阅读馆(源码+文档)【独一无二】
前端·css·html
Apifox21 小时前
Apifox 7 月更新|审计日志、密钥扫描防护、Postman/OpenAPI / Swagger 导入体验优化
前端·后端·测试
gcw10241 天前
JSONMe 简觅JSON 工具
json·json格式化·json可视化·json美化·json校验·好用的json工具·json编辑
名字还没想好☜1 天前
Next.js App Router 约定式文件实战:loading、error、not-found 怎么兜住加载态与异常
开发语言·前端·javascript·react·next.js