从浏览器输入url到页面加载(五)请求数据在网线中的故事

1 前言

上一章我们说到了,为了确保连接通道已建立完成,进行三次握手的确认。但无论是请求页面,还是发送一个ajax请求,数据都是要达到服务器的,包括header头,body信息这些。一旦离开了客户端浏览器,再离开了客户端操作系统,就要开始漫长的网线旅程了。

2 按地址发送

我们之前说过,数据要穿过离得最近的集线器,下一跳,下一跳的跳过路由器,慢慢的达到服务器目的地,而这中间环节决定往哪里的路由器跳,完全是由ip地址或者说数据包头部信息决定的。就像邮递员,他只看信封的邮编,地址,不用看信件里面的内容,就知道往哪里送。

这里说个题外话,配送地址讲究三级地址,四级地址,例如省份,城市,县,乡镇(或者是街道)这是四级地址。但据我分析,未来肯定不止这四级了,你想啊,出海业务,不得加个国家啊,以后月球,火星,地球开始配送了,那不得加个星球啊,对吧。

3 电信号在传输过程中的衰减

我们知道,发送的web请求,都要通过网线走这个旅行的过程,而网线里面那8根小细线,传导的是电信号,或者是电流,怎么流?从客户端的网卡往网线流。什么流,电流,刺啦刺啦的那种。网卡中有设备将数据包转为电信号,而以太网信号的本质就是正负变化的电压了呗。

有电压,就会想到初中学的电阻,网线越细,网线越长,电阻就会越大,那么无疑,电信号在网络中传输的时候,越走越没劲,会有信号衰减的情况。

记得也是初中的时候,有个同学去看他姐姐的孩子(也就是同学的外甥)。自己本来零花钱就不多,买了两瓶歪歪,准备给外甥。但走着走着,感觉挺累,喝了一瓶。

而一旦中间电信号衰减, 如果本来就已经衰减的信号再进一步失真 ,就会出现对0和1的误判,这就是产生通信错误的原因。

4 电磁波影响正常传输数据的电信号

双绞线就是两根小细线拧麻花,你要是不知道麻花是啥,那可能不太好理解。双绞线的作用是为了抑制噪声。电流声听过没?我之前买了一个thinkpadE几几,那家伙插上电滋滋的响,当然,这只是一种形象的比喻。网线嘛,通电后周围总是会有电磁波的,电磁波如果周围有金属,那么就产生电流了。

我们说网线里本来就是电流,然后新的噪声(电磁波)又产生了新的电流,都是电信号,都是电流,虽然一个是从大本营出发的正规军,一个是半路换上衣服混进来的,但混合起来,就分不太清了,会互相影响。

我们说双绞线就是麻花形状的,要是还有点疑惑,剪开网线看看那8根小细线,里面有麻花,咸的。把电信号线做成螺旋麻花形状,那么电信号也是螺旋形状的,然后噪声电信号在通过电磁场过来后的电信号方向就会相反,从而使得噪声电流相互抵消,噪声就得到了抑制。

一根网线里8根小细线,对吧,他们都自带电流,但是你想啊,一根网线才多粗,里面还有8根,这8兄弟离得这么近,能不相互干扰嘛。这就需要在双绞线的缠绕上做手脚,双绞线是螺旋形状的,所以就做成缠绕间隔的差异性,让他们有的正信号离得近,有的地方负信号离得近,同性互斥嘛,对吧。

再或者是给整根网线外层加保护膜,给双绞线加保护膜,这都是工艺手段。所以你就看,创新无处不在,你在工作中多用心,一个月硬写一个专利肯定没问题啊。

说到这里,如果哪天面试,你觉得面试官在难为你,你就问他,网线里有几根小细线?他如果说8根,你就说不对。他如果敢说4根,你就说,不对。他如果还敢问这根前端有什么关系,你就跟他说,废话,从浏览器输入url到页面展现,你的数据不得过网线啊,你说有没有关系。他要是敢生气,你就掀他们公司的桌子,最好是那种圆桌,玻璃的,手一碰还来回晃那种(哈哈,开玩笑的,别真的去掀桌子)。

5 小结

其实做为前端开发,我们每天都会涉及到请求网页,请求数据,而且现在大家都用笔记本,用wifi,也不插网线了,但在整个数据传输过程中,一直到服务器,中间还是会有路由器,有网线环节的。

我们平时更多的是组装一下JSON数据,和服务端联调,拿到RES数据进行渲染,做一些动画效果。那么了解这一章节的知识有没有用呢?反正我是觉得挺有用的,至少大晚上的看见了麻花。

相关推荐
GIS之路7 分钟前
GDAL 实现矢量裁剪
前端·python·信息可视化
是一个Bug11 分钟前
后端开发者视角的前端开发面试题清单(50道)
前端
Amumu1213813 分钟前
React面向组件编程
开发语言·前端·javascript
学历真的很重要13 分钟前
LangChain V1.0 Context Engineering(上下文工程)详细指南
人工智能·后端·学习·语言模型·面试·职场和发展·langchain
持续升级打怪中34 分钟前
Vue3 中虚拟滚动与分页加载的实现原理与实践
前端·性能优化
GIS之路38 分钟前
GDAL 实现矢量合并
前端
hxjhnct40 分钟前
React useContext的缺陷
前端·react.js·前端框架
前端 贾公子1 小时前
从入门到实践:前端 Monorepo 工程化实战(4)
前端
菩提小狗1 小时前
Sqlmap双击运行脚本,双击直接打开。
前端·笔记·安全·web安全
前端工作日常1 小时前
我学习到的AG-UI的概念
前端