专栏首页黄子玥的专栏深入理解websocket传输过程
原创

深入理解websocket传输过程

上一篇已经大概介绍了websocket是基于tcp传输的上层协议,且握手方式借用了http的过程,这个过程我们通过一个强大的网络抓包工具wireshark来看个究竟吧。

打开wireshark,过滤器写websocket协议进行过滤,选一个包进行TCP流追踪

这样做的目的是为了得到与浏览器打开网站相关的数据包,将得到如下图:

具体我们来分析一下这几个包都干了什么:

链接过程

①先来看一个老图——TCP报文格式及握手过程O(∩_∩)O:

可见第一步(前三个包)是TCP协议的三次握手过程,详细报文信息可以点击封包详细信息进行查看,这里不再具体说明了:

报文格式对应说明:

②第四个包是HTTP协议,查看封包详细信息,标明请求升级为websocket协议:

ps:wireshark封包详细信息中与OSI七层模型的对应关系如下:

③第五个包继续是TCP协议,从ip可以看出事服务器发送给客户端的,ACK表示确认包收到了(过程中不间断有ACK回包进行确认),然后第六个HTPP协议包将HTTP转为ws协议:

打开第六个包的封包详细信息,如下:

传输过程

④后面的封包已经转为ws协议,使用ws协议进行数据传输,查看详细信息:

ps:封包里面带了MASKED的都需要通过Masking-Key进行解迷后,Line-based text data才会能明文展示,否则展示如上图是乱码。比如第九个封包Mask:False,则可直接看到传输的数据内容:

PS:观察股指游戏的ws数据传输,会有类似客户端只传1,然后服务器回包2,为发送的心跳信息,来保证对方还存活。

关闭过程

①客户端发起一个TCP Close(这里是关闭浏览器,也可以是服务端想客户端发起close)

一旦发送或接收到一个Close控制帧,这就是说,_WebSocket 关闭阶段握手已启动_,且WebSocket连接处于CLOSING状态,一个Close控制帧可以包含一个表示关闭原因的状态码。比如1000表示正常关闭。具体错误码意思参考文章:

http://www.cnblogs.com/micro-chen/p/6046354.html

需要注意下这几个包ACK的包表示服务器收到了客户端请求的回包,为什么有三个TCP回包且长度一样?查了一下TCP segement of a reassembled PDU的打印意思,大概知道其实是主机响应一个查询或者命令时如果要回应很多数据(信息)而这些数据超出了TCP的最大MSS时,主机会通过发送多个数据包来传送 这些数据(注意:这些包并未被分片)。对wireshark来说这些对相应同一个查询命令的数据包被标记了“TCP segment of a reassembled PDU”,这不影响我们对关闭过程的学习和了解。

最后四步,是TCP的四次挥手协议,可以再看一个老图O(∩_∩)O:

参考文章:http://www.9upk.com/article/2537.html

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Websocket 基础篇

    WebSocket 规范定义了一种API,可在网络浏览器和服务器之间建立“套接字”连接。简单地说,客户端和服务器之间存在持久的连接,而且双方都可以随时开始发送数...

    喵小贱
  • 电脑开机密码忘记了咋办,三分钟教你PJ掉

    我们下载好微PE工具箱具,建议小伙伴们下载微PE之WIN10PE。下载好以后我们打开软件—点击软件界面右下角【其它安装方式】旁边的USB图标。

    IT小侠公社
  • 11张图步步演进:你一定能看懂的【分布式系统】容错架构设计!

    墨墨导读:讲述大规模分布式系统的容错架构设计。虽然定位是有“分布式”、“容错架构”等看起来略显复杂的字眼,但是这里用大白话 + 手绘数张彩图,逐步递进,让每位读...

    数据和云
  • 百度人脸识别服务API首次对外开放

    月24日,百度研究院深度学习实验室(IDL)宣布,通过APIStore将其自主研发的百度人脸识别技术免费对外开放。

    极客人
  • NVIDIA NVLink 崭新连接方式 较 PCIe 界面更具效率

    本周美国能源署宣布计划打造两部搭载 NVIDIA GPU 加速器的超级计算机,每秒运算速度将可达 100 petaflops , NVIDIA 并正为超级计算...

    GPUS Lady
  • email.py 邮件发送

    py3study
  • 前端开发,关键技术点杂烩

    缓存:ETag Expire Last-Modified 三者合用,Expire 可以让浏览器完全不发起 Http 请求,若 F5 发起请求,也可以通过判断 E...

    用户5997198
  • 可能是最全最易记的CSS选择器分类大法

    最近查看了几位同事的代码,发现很多CSS书写习惯都是清一色的类名而没有相应的选择器,层层嵌套的标签都包含至少一个类名。有些同学会问,很多文章都说「选择器」有性能...

    JowayYoung
  • 前端关键技术点杂烩,这些你必须知道

    这里总结一下 WEB 前端面试的常见问题,同时这些问题也是对一些基础的技术概念和思想的理解。对这些基本知识的掌握程度和深度决定了你的技术层级。高级工程师是必须掌...

    用户5997198
  • Core官方DI解析(4)--CallSiteRuntimeResolver

    ​ CallSiteRuntimeResolver类型是一个创建或获取服务实例的类型,这个类型继承了CallSiteVisitor<TArgument, TRe...

    莫问今朝

扫码关注云+社区

领取腾讯云代金券