浏览器缓存控制、动态内容
-
21-09-2019 - |
题
问题: 我似乎无法让 FireFox 缓存从动态服务器发送的图像
设置: 静态 Apache 服务器,具有到后端动态服务器 (mod_perl2) 的反向代理。
这是服务器的请求 URL。它被发送到动态服务器,其中 cookie 用于验证对图像的访问:
请求标头
Host: <OBSCURED>
User-Agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.0.15) Gecko/2009102815 Ubuntu/9.04 (jaunty) Firefox/3.0.15
Accept: image/png,image/*;q=0.8,*/*;q=0.5
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Referer: <OBSCURED>
Cookie: pz_cred=4KCNr0RM15%2FJCOt%2BEa6%2BL62z%2Fxvbp2xNQHY5pJw5d6Q
Pragma: no-cache
Cache-Control: no-cache
动态服务器将图像流式传输回服务器,并提供以下响应:
响应头
Date: Tue, 24 Nov 2009 04:28:07 GMT
Server: Apache/2.2.11 (Ubuntu) mod_apreq2-20051231/2.6.0 mod_perl/2.0.4 Perl/v5.10.0
Cache-Control: public, max-age=31536000
Content-Length: 25496
Content-Type: image/jpeg
Via: 1.1 127.0.1.1:8081
Keep-Alive: timeout=15, max=75
Connection: Keep-Alive
到目前为止,一切都很好(我认为)。然而, 重新加载页面时, ,图像没有出现缓存,并且再次发送请求:
请求标头
Host: <OBSCURED>
User-Agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.0.15) Gecko/2009102815 Ubuntu/9.04 (jaunty) Firefox/3.0.15
Accept: image/png,image/*;q=0.8,*/*;q=0.5
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Referer: <OBSCURED>
Cookie: pz_cred=4KCNr0RM15%2FJCOt%2BEa6%2BL62z%2Fxvbp2xNQHY5pJw5d6Q
Cache-Control: max-age=0
似乎不应该发生请求,因为浏览器应该缓存图像。实际上,收到了 200 响应,与第一个响应相同,并且图像似乎已重新获取(尽管浏览器似乎确实正在使用缓存的图像)。
Cache-Control 似乎暗示了该问题:上面的重新加载请求标头中的 max-age=0。
有谁知道为什么会发生这种情况?也许这就是 通过 导致问题的响应中的标头?
解决方案 2
我以前的答案是仅部分地正确的。强>
<强>问题强>是Firefox 3的手柄重新加载事件的方式。显然,它几乎总是再次从源服务器请求内容。因此,Cache-Control: max-age=0
请求头。
火狐确实使用高速缓存图像来呈现上装载的页面,但随后仍然让所有的请求,向他们“在后台”。然后,它替换它们,因为他们来英寸
因此,页面呈现快速,YSlow的报告缓存的内容。但是,服务器还是会被钉。
<强>分辨率强>是询问输入标头中的动态服务器脚本,并确定是否一个“如果-Modified-Since的”被提供标头。如果是这种情况,并且确定内容没有改变,一个HTTP_NOT_MODIFIED被返回(304)的响应。
这是不是最优的 - 我宁愿火狐并不发出请求 - 但它减少了一半的页面加载时间,并大大降低了带宽。鉴于火狐适用于重载的方式,这似乎最好的解决方案。
其他评论:吉姆·弗兰的有关导航的页面路程,返回地点有可取之处 - 缓存总是使用,并没有要求是传出(+1吉姆)。此外,内容动态地添加(在初始加载后例如AJAX调用)出现使用缓存。
希望这可以帮助别人,除了我:)
其他提示
在原始请求具有
Cache-Control: no-cache
它告诉所有的中间HTTP缓存(包括Firefox的),你不希望使用缓存的响应,你想从原点Web服务器本身的响应。
的响应说:
Cache-Control: public, max-age=31536000
,它告诉大家,只要原始服务器而言,响应可被缓存。服务器似乎被配置为使PNG图像要被缓存: HTTP 1.1 (第14.21)表示:
注意:如果一个响应包括 与最大年龄的Cache-Control场 指令(见14.9.3),即 指令覆盖过期字段。
您第二请求表示:
Cache-Control: max-age=0
,它告诉所有中间HTTP缓存你不会采取大于0秒的年龄较大的任何缓存的响应。
有一点需要注意:如果你在Firefox击中刷新按钮,你问从源Web服务器重装。为了测试图像的缓存,从页面导航离开和回来,或者在新标签中打开它。不知道为什么你没有看到缓存在第一时间和最大年龄= 0第二,虽然。
顺便说一句,我喜欢萤火插件用于Firefox。你可以看看它的请求和响应头和各种其他的好东西。
看起来已经解决了:
- 通过标头删除代理
- 添加了 Last-Modified 标头
- 添加了一个遥远的到期日期
Firebug 仍然显示来自源服务器的 200 个响应,但是,YSlow 将图像识别为缓存。根据YSlow的数据,新鲜时的总图片下载大小大于500K;缓存已启动后,它显示 0K 下载大小。
这是来自 Origin 服务器的响应标头,它可以实现这一点:
Date: Tue, 24 Nov 2009 08:54:24 GMT
Server: Apache/2.2.11 (Ubuntu) mod_apreq2-20051231/2.6.0 mod_perl/2.0.4 Perl/v5.10.0
Last-Modified: Sun, 22 Nov 2009 07:28:25 GMT
Expires: Tue, 30 Nov 2010 19:00:25 GMT
Content-Length: 10883
Content-Type: image/jpeg
Keep-Alive: timeout=15, max=89
Connection: Keep-Alive
由于我请求图像的方式,这些日期是否静态并不重要;我的应用程序知道请求图像之前的最后修改时间,并将其附加到客户端的请求 URL 中,为每个图像版本创建唯一的 URL,例如 http://myserver.com/img/125.jpg?20091122 (该信息来自 AJAX JSON feed)。例如,我可以将最后修改日期设为 2000 年 1 月 1 日,并将过期日期设为 2050 年的某个时间。
如果 YSlow 是正确的——性能测试表明它是正确的——那么 FireBug 应该真正报告这些本地缓存命中而不是 200 响应。