换了节点,网页还像旧版本:区分缓存与联网结果
摘要:区分HTTP缓存、条件验证与Service Worker响应,避免把旧页面的展示误当成新节点的连接结果。
切换代理节点后,旧网页依然秒开,页面内容却没有变化。浏览器可以复用以前保存的资源,页面“显示出来”和这次“从网络取回来”是两件事。排查时应先找到具体请求,再判断它的来源。
缓存新鲜,不必重新下载
HTTP缓存会按照响应的有效期等条件决定能否复用。新鲜的响应,可以在不联系源站的情况下满足后续请求。缓存规范说明了这套机制,因此打开熟悉的页面,不能单凭速度或外观确认新出口已连通。
缓存需要验证时,浏览器可能带上ETag对应的条件字段询问资源是否改变。服务器回复304,表示可继续使用已有内容,这个响应本身没有新的正文。MDN说明给出了过程。它与完全没有网络请求不同,也不能当成重新下载整个页面的证据。
还有站点自己的离线机制
部分网站使用Service Worker处理请求,可能返回预先缓存的内容,让页面在离线时仍有部分功能。浏览器的HTTP缓存与这种站点机制应分别观察;只关闭一种缓存,不能假定所有资源都重新联网。
Chrome的Application面板可以查看Service Worker,Bypass for network可暂时绕过它的请求处理。官方调试文档说明了该选项。测试后恢复原设置,无需清除整站数据或退出账号。
用一次明确的请求做对照
打开开发者工具的Network面板,清空旧请求记录,在工具保持打开时启用Disable cache,再重新加载一个无需登录的公开页面。网络面板说明介绍了这个控制项。观察主文档是否出现新请求、状态码、传输情况与实际内容,不只看加载动画。
不要混淆“清空请求列表”和“清空浏览器缓存”:前者只是整理记录。用后退按钮恢复页面,也可能复用历史页面快照,不能代替重新加载。如果主文档正常而图片失败,再分别查看相关资源的域名和请求。
最后对照代理客户端记录,确认新请求选中了预期出口。浏览器面板能帮助判断资源获取过程,却不能独自证明走了哪个节点。保留请求时间,让结论只覆盖本次观察。