如何知道资源是否真正从 chrome devtools 中的缓存加载？

Question

Chrome devtools 网络选项卡显示与缓存资源文件大小相同的“通过网络传输的数据”值。如果我阻止上图中出现的最后一个请求，则不会加载图片，但第二个请求仍然显示传输了相同数量的数据。如何知道图像资源是否真正从缓存中提取并节省了带宽？

注意：我正在使用 max-age 缓存控制策略，并且在 Firefox 中它显然有效。

Answer 1

您问题的最终答案可以通过您请求资源的服务器的访问日志来提供。只需在您的请求中添加“指纹参数”并检查服务器的访问日志即可。

另一种选择是使用像 webQsse 这样的扩展（https://chrome.google.com/webstore/detail/webqsee-web-sniffer-recor/gamdpfnfkjknkimfbboonmgdfnondfme），它也显示图像的加载位置。