Web开发调试利器——Wireshark的使用

在Web开发中,尤其是前后端分离架构的项目中,后端开发拿Postman测自己写的接口,觉得数据是正常的就OK了,可Postman毕竟不是浏览器,有些在浏览器里存在的问题会让我们感到很诧异。究竟是哪里出了问题,后端说不是我接口的问题,肯定是你发送的请求有问题,而我们在浏览器的开发者工具中看到发送的数据是对的,这时该如何去测试找出问题呢?

我们发送的POST,GET等请求方式都属于HTTP请求,虽然是HTTP请求,但还是基于TCP连接。而HTTP协议属于OSI网络参考模型的应用层,TCP协议属于传输层,也就是说数据最终还是要通过TCP协议来传输。所以客户端和浏览器之间传输任何数据都要通过TCP端口。我们只要监听本地的TCP端口就可以截获客户端和服务器通信的数据包,术语叫抓包。

750327-20160822230932011-1299422087.jpg

来看一个例子:我用Postman来请求一个接口的数据

image.png

然后就可以在Wireshark中截获这个请求

image.png

然后跟踪一下TCP Stream

image.png

我们可以看到客户端和服务端交互的真实数据,并且能看出Postman和浏览器发送的数据有什么差异,快速分析出问题所在。
甚至还可以看到在一次请求中完整的连接过程,包括三次握手和四次挥手。

image.png

过滤表达式规则

这个是最常用的功能,就是精确匹配你想抓取的数据,用好这个,就可以满足大部分需求了。

  1. 协议过滤

比如TCP,只显示TCP协议。

  1. IP 过滤

比如 ip.src ==192.168.1.102 显示源地址为192.168.1.102,

ip.dst==192.168.1.102, 目标地址为192.168.1.102

  1. 端口过滤

tcp.port ==80, 端口为80的

tcp.srcport == 80, 只显示TCP协议的愿端口为80的。

  1. Http模式过滤

http.request.method=="GET", 只显示HTTP GET方法的。

  1. 逻辑运算符为 AND/ OR

常用的过滤表达式

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 简介 用简单的话来定义tcpdump,就是:dump the traffic on a network,根据使用者...
    保川阅读 5,989评论 1 13
  • 1.OkHttp源码解析(一):OKHttp初阶2 OkHttp源码解析(二):OkHttp连接的"前戏"——HT...
    隔壁老李头阅读 21,028评论 24 176
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,986评论 19 139
  • 1.这篇文章不是本人原创的,只是个人为了对这部分知识做一个整理和系统的输出而编辑成的,在此郑重地向本文所引用文章的...
    SOMCENT阅读 13,135评论 6 174
  • 名词延伸 通俗的说,域名就相当于一个家庭的门牌号码,别人通过这个号码可以很容易的找到你。如果把IP地址比作一间房子...
    杨大虾阅读 20,644评论 2 56