梧州网站推广,做网站公司是干什么的,慈云寺网站建设,网站如何赚钱前言#xff1a; 最近在使用 VSCode 调试 web 程序时#xff0c;遇到一些问题#xff0c;当时不知道如何是好。所以决定抓看来看一看#xff0c;然后一顿操作猛如虎#xff0c;成功安装了抓包软件 – Fiddler Classic。我并没有使用 Postman 这种重量级的 HTTP 测试软件 最近在使用 VSCode 调试 web 程序时遇到一些问题当时不知道如何是好。所以决定抓看来看一看然后一顿操作猛如虎成功安装了抓包软件 – Fiddler Classic。我并没有使用 Postman 这种重量级的 HTTP 测试软件而是直接使用了 VSCode 的插件 – REST Client。然后我发现在 Fiddler 里面居然无论如何都是看不见这个插件发出来的数据包或者更直接一点看不到 VSCode 的包。经过一番在互联网上的搜索最后发现了需要在 VSCode 中配置代理才行。不过正是这番折腾也让我重新思考起了以前一个困惑我的问题抓包软件的工作原理是什么我曾经对这个很好奇知道了它是通过代理来实现的但是这种浅显的理解遇到问题时还是会显得束手无策。下面就让我们再去探索一番如果每一次探索都能获取到更深一层的理解那便是最好不过的事情了。所以学习更像是一种螺旋上升的过程不是一蹴而就当然了如果不持续努力就会一直原地踏步甚至缓慢下降。 VSCode 抓包配置
先看看一下这个问题的解决方案吧这里先来一个示例查看指定QQ号的头像这是一个在网上公开可查询的 API我相信大家的为人所以这里我没有使用自己的 QQ 号。
浏览器抓包测试 然后在 Fiddler 中可以查看该请求注意我在上面禁用了缓存防止因为缓存导致看不到图片了。这里可能数据包太多了导致看不过来可以在抓到数据包后暂停抓包或者在上面的列中进行搜索或者过滤。现在是浏览器的包这是一切正常的下面我们来使用 VSCode 的 REST Client 插件来请求这个接口试试。 VSCode 抓包测试
首先在 VSCode 中访问这是没有问题的可以正常请求到数据而且它还很贴心的直接渲染成图片了。 这里我设置只抓取非浏览器的数据包不然数据包太多了看起来很麻烦。
然后你猜怎么着我本来是想演示VSCode 不配置是抓不到包的结果今天在我自己的电脑上它就正常了。因为我之前是在其它电脑上操作的换了一个环境结果它就正常了。不过现在我想要的是不正常的结果。不过我现在对这一块也有了解不至于像上次一样手足无措了。既然正常了那就直接去看下一部分待会再聊这个话题。 注意因为我使用的 VSCode 版本较新可能是新版的配置变更了。所以我贴出来我的版本如果你的表现或者配置与我不一致可以考虑更新到同一版本或者更高的版本。 注意经过我的又一次分析我发现 VSCode 的包 Fiddler 抓不到是因为它们两个之间启动顺序的关系。VSCode 是基于开源的 Chromium 内核的就是浏览器内核所以按理说它是可以自动识别代理的。所以其实问题就是因为我是先开的 VSCode然后启动的 Fiddler但是 VSCode 不会自动识别代理的开启和关闭必须重启 VSCode 才行这确实是一个未曾想到的坑。
Fiddler 抓包的原理
当我们正常的访问网络服务时忽略其它的因素的存在专业一点应该叫透明我们是直接访问远程服务的。然后开启代理之后我们是通过代理来访问远程服务的即我们先把请求发给代理代理再去请求远程然后把响应信息返回给应用程序。我这里使用单箭头因为我只是画了请求的过程哈哈似有不妥但是你理解就好了。 注意在 Fiddler 中讨论的是 HTTP 代理它应该是使用最广泛的了不过代理不止只有 HTTP 代理。
所以现在我们去看看 Fiddler启动它之后它会开启一个代理服务器并监听 8888 端口。我们打开菜单查看 connections 栏可以看见下面这个弹窗。 Fiddler Classic can debug traffic from any application that accepts a HTTP Proxy. All WinINET trafic is trouted through Fiddler Classis when “File Capture Traffic” is checked. 这里最重要的就是这个第一句了Fiddler Classic 可以调试接受 HTTP 代理的任何应用的流量。这里的关键字是接受所以那就有人可以 reject 拒绝 喽其它的信息这里忽略不去理会因为并不属于这里的重点。
注有些软件因为一些原因不会走代理例如有道词典我就没有抓到它的包我上次见的说法是它不使用 HTTP 协议也有可能是它不走代理不过具体不了解表现就是代理看不到它的请求信息。
也就是说Fiddler 开了一个代理服务器所有的应用程序接受 HTTP 代理都会它发送请求然后由它进行中转发送并接受响应数据然后再转给发送者。那你有没有想过其它程序为什么会知道 Fiddler 的代理呢或者它们为什么会相信一个未知的软件呢这其实是一个很有趣的问题。因为它们并不知道 Fiddler也不会去关心它的存在当然了得排除哪些不想让你调试它们的软件。 答案其实很简单系统代理操作系统都是会支持网络代理功能的。但是它并不是真正工作的代理软件只是告诉其它软件这里启用了系统代理因为是操作系统所以应用软件都能知道系统启用了代理功能。
而 Fiddler 就是真正工作的 代理软件如下图的 Gateway网关这里的截图。 然后去 Windows 中查看系统代理不同版本的系统截图可能不一致不过大体上也不会相差太大的。我现在使用的是 Window11下面是我的系统的截图。不过这里居然没有设置端口而是直接在URL中指定了可能这样也是可以正常工作的吧。所以你现在应该大致上明白了吧。因为操作系统是支持代理这个功能的而且这也是必须由操作系统支持的因为通过代理上网是非常必要的功能。既然系统支持了那么软件就不可能不支持了否则用户启用了代理而软件不走代理那么就会导致软件的行为和用户的预期不一致了这是 BUG呀有些工作是必须通过代理上网的代理的运用是很广泛的例如企业内部的 VPN 服务。 现在的浏览器都践行这种 KISS 原则它会自动检测到代理开启所以不需要用户去手动配置了。不过对于我们这些非普通的用户还是有必要了解代理的工作原理的。不然如果出现问题了你就会变成真正的傻瓜了。
注KISSKeep It Simple and Stupid傻瓜原则 所以我们可以看清 Fiddler 的本质其实是一个 HTTP 代理软件兼具抓包功能这个功能比较强大反而让人忽视了它的本质。因为代理本质上就是数据的中转站那它自然就可以选择查看或者不查看用户的请求了。如果它不看那它就是纯粹的代理软件 如果它看了那它是抓包软件了。
VSCode 的代理配置
打开下面这个界面然后搜索 http: proxy可以看见下面这些配置。最上面的这个是代理配置如果没有设置的话它会继承 http_proxy 和 https_proxy 这两个环境变量不过我也没有设置它们并且查看了确实没有。然后是下面的这个配置 Http: Proxy Support它下面写着它的作用Use the proxy support for extensions. (对插件使用代理支持)因为我这里没有在 VSCode 中开启代理看起来是这个配置的作用。 注意这里可以看到我改了 Http: Proxy Authorization这个是代理认证相关的属性我只是点击进去它给配置了默认的 null 值然后我就退出来了。不过这里我也没有使用需要认证的代理所以也没关系的。 下面我把这个配置给关掉再试一试这个默认的配置项 override 的作用就是对插件启用代理支持覆盖默认的请求选项。现在改成 off禁用插件的代理支持。然后多次请求那个查看 QQ 头像的接口可以发现已经无法再看到相应的请求了。这里现在设置了只查看 VSCode 的请求数据。这个 code 进程就是 VSCode。所以以后如果遇到 VSCode 无法抓包的问题就开启下面这个选项就行了注意VSCode的版本。下面使用 GIF 来演示关闭代理支持之后的抓包情况。 注意因为我的 VSCode 版本较新如果是使用的老的版本可能需要手动配置上面的 Http: proxy不过要小心如果你之后关闭了代理软件你的 VSCode 就无法联网了
代理软件最常见的问题
下面举一个例子这应该是代理软件最常出现的问题大部分人应该都遇到过的 – 代理软件的非正常关闭。让我们先把 Fiddler 关闭然后查看系统代理正常情况下它是关闭的现在让我们手动打开它配置和之前一样。然后接下来会发生什么呢 服务中断你的浏览器就无法访问任何网页了就像下面这样。 不过某些软件例如 QQ 之类的会继续正常工作因为它不走代理它用的不是 HTTP 协议不过这种软件都是很复杂的了只是说通讯的部分不使用。这个很好解释就像上面那那个图一样软件把请求发给系统代理就是 Fiddler 启动的代理服务器然后这个服务器早就关闭了所以所有的请求都根本没有人接收自然就会报错了。解决办法那自然就有两个了关闭系统代理或者重新开启 Fiddler 或者任何你使用的代理软件。只要是用过代理软件的人应该都会踩过这个坑哈哈。 TIMQQ 设置代理 小小的扩展
你有没有想过到底代理是怎么工作的呢带着这个疑问让我们进行一点微不足道的探索吧这里我来提供一个小小的示例程序跟着我一起去看看吧不要弄那么复杂了这个代码就是随便写的展示一下简单的原理。
package mainimport (lognet
)const RSP HTTP/1.1 200 OK\r\n content-type: application/json; charsetutf-8\r\n content-length: 39\r\n server: CrazyDragon\r\n \r\n {\rsp\: \Hello, I am CrazyDragonProxy\}\r\nfunc main() {// 监听本地的 9999 端口server, err : net.Listen(tcp, localhost:9999)if err ! nil {log.Fatal(err)}// 读取数据的切片data : make([]byte, 1024)for {if conn, err : server.Accept(); err nil {if n, err : conn.Read(data); err nil {log.Printf(%s, string(data[:n])) // 打印接受到的数据conn.Write([]byte(RSP)) // fake response! 随便弄一个假的响应糊弄了事conn.Close()} else {log.Fatal(err)}} else {log.Fatal(err)}}
}
先开启代理设置配置如下 然后就按照这个 GIF 中做的即可注意我虽然开了代理但是代理后面并没有软件所以此时 VSCode 的插件是无法正常联网的因为代理软件没开然后我启动了代理软件我自己写的垃圾不过它已经可以符合一个正常的代理了然后这个插件就可以正常工作了。
注意 有时候开启了代理但是 VSCode 还是不走代理并且配置也是正常的。可以考虑重启或者 Reload Window 刷新一下因为配置可能没更新VSCode 没有更新系统代理的变更。
在 VSCode 中演示 在浏览器中演示
注这里有一个小问题似乎第一次请求会卡住不知道为什么所以我强制刷新一下。 下面这个是打印输出的部分信息中间的方框内是接收到的访问 QQ 头像的请求这里出现了很多 CONNECT 请求它也是 HTTP 方法的一种不过它不会用在 WEB 请求中。而是专门用来给 HTTPS 进行代理的HTTPS 代理曾经也是一个难题TLS这就是解决方案不过我也就了解这么多。我这里只是一个简单的 HTTP 代理它尝试来建立连接当然是不会成功了哈哈。 所以如果访问 https 网址效果就是这样的这里肯定是 CONNECT 建立失败了就是有关于 TLS 这方面的东西。所以我测试使用的是 http 的网址。 什么决定了使用代理
为什么有的可以选择走代理有的可以选择不走代理呢这是由什么决定的呢如果你有过网络爬虫的经验应该就能明白了。编程语言的 HTTP 客户端都是可以配置使用代理的就以为 Go 为例 因为代理是很重要的功能所以它是一个 HTTP 客户端必不可少的功能。不过上面也说了可以选择 no_proxy禁用代理所以有些软件即使使用 HTTP 协议你也是抓不到的因为它根本就不使用代理。风过留声雁过留痕。既然不从代理走代理也就根本无法感知到它们的存在了。
总结
有趣的探索结束了我确实感觉自己收获了不少也把以前的一些知识串联起来了。希望各位读者也能从中有所收获。
参考链接 If I have been able to see further, it was only because I stood on the shoulders of giants. 如果说我看得比别人更远些那是因为我站在巨人的肩膀上。 HTTP 代理原理及实现 技术分享| HTTP 代理 部分APP无法代理抓包的原因及解决方法 大厂app抓不到包怎么办这篇文章告诉你答案
