继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

HTTP 缓存机制

一俢
关注TA
已关注
手记 82
粉丝 12
获赞 135

为了提高浏览器 HTTP 请求的性能,在 HTTP 协议中有几种缓存机制来保证网络访问的性能。HTTP 协议中提供了如下几种缓存:Cache-Control、Expires、Last-modified 和 ETag,很好的利用它们可以提高我们网站的速度。

Expires

Expires 类似于 Cache-Control 中的 max-age,它告诉浏览器在这个时间(例如:Last-Modified:Sat, 25 Jun 2016 02:26:30 GMT)内直接从本地读取资源,不必再次向服务器请求。

Cache-Control

它用于定义资源的缓存策略,可以设置以下值:

  • no-store:绝对禁止缓存,每次请求支援都要从服务器端获取;

  • no-cache

  • publice:允许代理服务器缓存资源;

  • private:不允许代理服务器缓存资源;

  • max-age:设置缓存的最大有效时间(单位:秒),当发送请求的时间在有效期范围内,它不会向服务器发送请求,直接从本地获取资源。当它与 Expries 缓存同时使用时,Expries 失效;

  • s-maxage:类似于 max-age,只适用于 publice` 缓存,一般用在 CDN 服务器上;

当 Expires 和 max-age 同时存在时,Expires 将被忽略。

Last-modified

Last-modified 是服务器端返回给浏览器资源的最后修改时间。如果同样一个资源的最后修改时间有变动,服务器会返回给浏览器 200 告诉浏览器需要重新向服务器请求新资源;如果没有变动,服务器会返回浏览器 304 告诉浏览器资源没有变动,直接从本地读取。

ETag

ETag 是为了解决 Last-modified 的一些缺陷:

  • 一些资源的最后修改时间变了,但是内容没有改变;

  • Last-modified 只能精确到秒级;

这样我们引入了 ETag,服务端会通过资源文件生成一段 Hash 字符串来标示这个资源,在 HTTP 的头部会将此标示返回给浏览器端,同时浏览器每次请求会将 ETag 发送给服务器端,此刻服务器端会比较请求和和即将返回的资源的 ETag,如果不一样,服务器会返回给浏览器 200 告诉浏览器需要重新向服务器请求新资源;如果一样,服务器会返回浏览器 304 告诉浏览器资源没有变动,直接从本地读取。

当 Etag 和 Last-modified 同时存在时,Last-modified 会忽略。

它们的区别

为什么有这么多缓存呢,其实它们是存在区别的:Expires 以及 Cache-Control 两种缓存在有效期内,它们是不会向服务器端发送任何请求的,直接获取本地资源;然而 Last-modified 和 ETag 还是需要请求服务器,服务器比较完后高速浏览器是否需要从本地获取。

这几种缓存需要搭配使用,如果客户端的有效期失效后,再次访问服务器端让服务器端比较一下资源内容是否改变,如果改变了这样服务器端才返回最新资源。

对于不同的资源的缓存策略

不同类型的资源会采用不同的缓存策略,通常 html 文件经常会采用 Cache-Control:no-cache,css 和 js 文件通常会采用 Cache-Control:max-age



打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP