作者:小林coding
图解网站:https://xiaolincoding.com/
大家好,我是小林。
之前有读者在字节一面的时候,被问了这么一个问题:在浏览器输入 URL 并回车后,如果页面迟迟没有出现,怎么去排查问题?
我的回答:
最直接的办法就是抓包,排查的思路大概有:
总之就是一层一层有没有插网线,网络配置是否正确、DNS有没有解析出 IP地址、TCP有没有三次握手、HTTP返回的响应码是什么。
正好,昨天有位朋友的网站,访问 10 秒都还没显示网页,后面我帮他排查后,定位出了问题,修改问题后,网站访问速度就正常了。
所以,接下来,跟大家说下,我当时的排查思路。
昨天一大早上,朋友(程序员吴师兄)急忙找我,让我帮忙看看他的网站,很多人反馈说他的网站卡的要死,访问 10 秒都还没显示网页,所以很多人点开他的网站就溜了。
而且他说他自己访问很快,我自己也访问了下,确实访问很慢,10多秒都还没显示出网页。
接着,他给我发两个检测网站速度图。
第一张是网站测速结果:
第二张是 ping 检测结果:
第二张是网站访问速度检测结果:
他问我:ping 检测是红的,但国内测速是绿的,这两者有什么关系么?问题原因是 ping 不通导致的吗?
ping 检测走 icmp 协议,网站检测走 http 协议。如果你还不知道 ping 的工作原理,快去看这篇:ping 的工作原理
我觉得网站访问卡的问题肯定不是因为 ping 不通导致的,因为网站检测是绿的,至少证明了网站的 http 整个网络链路都是没问题的,访问网站不会用到 icmp 协议。
至于 ping 检测为什么是红的,是因为他服务器的防火墙屏蔽了 icmp 协议。
虽然 ping 能帮助我们判断网络延时,但是 ping 不通「不代表」服务器掉线了、网站不能访问了,因为有可能是 icmp 协议被防火墙屏蔽了。
那到底是什么原因导致呢?如何继续排查?
我首先用抓包工具抓了一下访问网站的网络包。
发现能正常进行 TCP 三次握手、TLS 握手、HTTP 数据传输,而且延时也很低。从这又证明,网站的网络是完全没问题的。
接下来,我就用浏览器的 F12 调试工具去排查了。
结果被我发现了好多个访问超时的 CSS 文件,原因就是这个了。这些 CSS 文件 迟迟请求不到,导致网站一直没有显示。
而且,这些 CSS 文件请求地址都是 jsdelivr cdn,这个 jsdelivr cdn 在国内已经用不了。
至于吴师兄自己为什么能正常访问,大家都懂
我之前自己的网站也是因为 jsdelivr cdn 的问题导致图片全部挂了 ,因为我最开始用的图床就是这个,后面我就自己购买了图床,才把问题解决了,当时的解决过程可以看这篇:完了,小林网站的图片都挂了
后面解决的方式也很简单,就是不要用 jsdelivr cdn 来加速静态文件就好了。他把网站的这个插件功能关闭后,就正常了。
好了,整个实战排查过程就这些了,简单总结下有用的知识:
怎么样?体验到计算机网络的美学了吗?