【技术干货】使用whistle进行前后端联调

简介: 在开发的过程中经常会进行前后端先约定定义接口,然后前后端独立开发,最后进行联调。过程中可能前端先完成开发,此时后端就可以借助前端开发好的页面白屏验证研发的接口与业务逻辑;可能后端先完成开发,前端就可以配置后端地址,直接验证页面逻辑,这里面主要的关键点就在于如何将页面的api请求自定义转发到期望的后端地址以及进行相关的转发逻辑配置。

Whistle

文档

基于Node实现的跨平台web调试代理工具,类似的工具有Windows平台上的Fiddler,主要用于查看、修改HTTP、HTTPS、Websocket的请求、响应,也可以作为HTTP代理服务器使用,不同于Fiddler通过断点修改请求响应的方式,whistle采用的是类似配置系统hosts的方式,一切操作都可以通过配置实现,支持域名、路径、正则表达式、通配符、通配路径等多种匹配方式,且可以通过Node模块扩展功能。

安装

mac

# x84

brew install whistle && w2 start --init


# arm64

brew install node && npm i -g whistle && w2 start --init

通用

# 需要先安装node 14及以上版本

# 安装node https://nodejs.org/

npm i -g whistle && w2 start --init

使用

浏览器 http://127.0.0.1:8899/

配置rule样例

# 将https://api.yunqiao.work/flow的 所有请求都转发到本地8080端口并配置请求的header带上用户相关信息,返回的header允许跨域

https://api.yunqiao.work/flowhttp://127.0.0.1:8080  reqHeaders://{req.header} resHeaders://{res.header}

```req.header

user.id: 1

user.name: test

```


```res.header

access-control-allow-credentials: true

access-control-allow-origin: https://daily.yunqiao.work

access-control-expose-headers: DNT, Content-disposition, User-Agent, X-Requested-With, If-Modified-Since, Cache-Control, Content-Type, Range

w2: true

```

更多【帮助文档

代理

系统级代理

# 命令行运行

w2 proxy

更多【帮助文档

浏览器级代理

全局代理如果会影响到某些客户端的请求,也可以使用浏览器插件设置代理(只对 浏览器 生效):

浏览器安装SwitchyOmega插件

选择 Whistle 代理

目录
相关文章
|
6月前
|
前端开发 Java 网络安全
|
前端开发 JavaScript 关系型数据库
开发中的前端和后端
开发中的前端和后端
187 0
|
4月前
|
存储 缓存 API
后端的技术方案怎么写?
本文讨论了编写方案的重要性,旨在帮助我们清晰理解需求并确保有效落地。方案应记录实现初衷,方便后续迭代,避免因缺乏文档导致的代码理解困难。通过方案评审,可以考虑通用性和复用性,减少重复工作。文章还强调了在新系统或已有系统上添加功能时需考虑的问题,如系统复杂度、耦合度、API依赖、兼容性、性能和数据处理。此外,方案应涵盖需求背景、系统架构设计(包括业务架构、状态机、存储、服务应用和服务治理)、上线计划和灰度发布策略。最后,文章提到了性能设计、复用性和中台建设的思考,指出设计应以满足实际需求和降低成本为目标。
134 0
|
4月前
|
前端开发 JavaScript Java
开发做前端好还是后端好?
开发做前端好还是后端好?
90 0
|
4月前
|
前端开发
若依部署,部署常见流程之先部署网页的后端系统,让自己的前端能够看到内容,先部署后端,让前端在本地跑起来-----吃饱了撑死了大佬建议,正确的部署流程
若依部署,部署常见流程之先部署网页的后端系统,让自己的前端能够看到内容,先部署后端,让前端在本地跑起来-----吃饱了撑死了大佬建议,正确的部署流程
|
6月前
|
IDE Java 开发工具
开发后端
自定义后端逻辑流操作基于Java编写,对于熟悉Java的开发者来说,可以运用Java的强大能力来扩展后端逻辑流。 【2月更文挑战第4天】
91 12
|
6月前
|
JSON 前端开发 Java
⚠⚠⚠java后端开发中,前后端联调过程一些常见的低级/低端问题汇总⚠⚠⚠
⚠⚠⚠java后端开发中,前后端联调过程一些常见的低级/低端问题汇总⚠⚠⚠
|
6月前
|
JSON 前端开发 JavaScript
从前端到后端——Web开发的全流程解析
【2月更文挑战第2天】Web开发涉及多个方面,从前端设计到后端实现,需要开发者具备一定的技术能力和知识储备。本文将以一个简单的Web应用为例,详细介绍Web开发的全流程。
|
6月前
|
前端开发 NoSQL 测试技术
Crossbar 后端开发调试混乱解决方案
Crossbar 后端开发调试混乱解决方案
58 0
|
存储 机器学习/深度学习 Kubernetes
前端设计走查平台实践(后端篇)
设计师在进行走查的过程中,肉眼的比对偶尔会忽略一些细微部分,同时也会耗费设计师大量的精力,为了辅助设计同学能够更高效的进行设计走查,本文旨在通过设计走查平台在后端侧的实践总结下对于视觉稿还原程度比对的一些思路。
123 0