http缓存

有时候为了页面加载快，我们需要让一部分资源默认缓存在本地，这样不用每次都进行请求。但若是发布也被缓存下来，这样就很尴尬了，本来已经更新了，却依旧显示上一次的，这样就不合理了

各种类型的缓存

私有缓存 [local (private) cache]
- 只能用于单独用户 (eg: 浏览器设置中的“缓存”选项。浏览器缓存拥有用户通过 HTTP 下载的所有文档。)
共享缓存 [shared cache]
- 共享缓存可以被多个用户使用 (eg: ISP 或你所在的公司可能会架设一个 web 代理来作为本地网络基础的一部分提供给用户。这样热门的资源就会被重复使用，减少网络拥堵与延迟。)

缓存操作的目标

常见的HTTP缓存只能存储GET响应，对于其他类型的响应无能为力

缓存控制

Cache-control 头

HTTP/1.1定义的 Cache-Control 头用来区分对缓存机制的支持情况，请求头和响应头都支持这个属性。通过它提供的不同的值来定义缓存策略
- 缓存请求指令 [客户端]
```
  Cache-Control: max-age=<seconds>
  Cache-Control: max-stale[=<seconds>]
  Cache-Control: min-fresh=<seconds>
  Cache-control: no-cache 
  Cache-control: no-store
  Cache-control: no-transform
  Cache-control: only-if-cached
```
- 缓存响应指令 [服务端]
```
  Cache-control: must-revalidate
  Cache-control: no-cache
  Cache-control: no-store
  Cache-control: no-transform
  Cache-control: public
  Cache-control: private
  Cache-control: proxy-revalidate
  Cache-Control: max-age=<seconds>
  Cache-control: s-maxage=<seconds>
```
- 指令解读
  - 可缓存性
    - public 表明响应可以被任何对象（包括：发送请求的客户端，代理服务器，等等）缓存
    - private 表明响应只能被单个用户缓存，不能作为共享缓存（即代理服务器不能缓存它）,可以缓存响应内容
    - no-cache 在发布缓存副本之前，强制高速缓存将请求提交给原始服务器进行验证
    - only-if-cached 表明客户端只接受已缓存的响应，并且不要向原始服务器检查是否有更新的拷贝
  - 到期
    - max-age=<seconds> 设置缓存存储的最大周期，超过这个时间缓存被认为过期(单位秒)。与Expires相反，时间是相对于请求的时间
    - s-maxage=<seconds> 覆盖max-age 或者 Expires 头，但是仅适用于共享缓存(比如各个代理)，并且私有缓存中它被忽略
    - max-stale[=<seconds>] 表明客户端愿意接收一个已经过期的资源。可选的设置一个时间(单位秒)，表示响应不能超过的过时时间
    - min-fresh=<seconds> 表示客户端希望在指定的时间内获取最新的响应
  - 重新验证和重新加载
    - must-revalidate 缓存必须在使用之前验证旧资源的状态，并且不可使用过期资源
    - proxy-revalidate 与must-revalidate作用相同，但它仅适用于共享缓存（例如代理），并被私有缓存忽略
  - 其他
    - no-store 缓存不应存储有关客户端请求或服务器响应的任何内容
    - no-transform 不得对资源进行转换或转变 (Content-Encoding, Content-Range, Content-Type等HTTP头不能由代理修改)
  - 示例
    - 禁止缓存
```
  Cache-Control: no-cache, no-store, must-revalidate
```
    - 缓存静态资源
```
  // 图像，CSS文件和JavaScript文件
  Cache-Control:public, max-age=31536000
```
禁止进行缓存
```
  Cache-Control: no-store
```
强制确认缓存
每次有请求发出时,该请求应该会带有与本地缓存相关的验证字段发到服务器，服务器端会验证请求中所描述的缓存是否过期，若为过期（返回 304），则缓存才使用本地缓存副本。
```
  Cache-Control: no-cache
```
私有缓存和公共缓存
- private 一般应用于浏览器私有缓存
- public 可以被任何中间人（eg: 中间代理， cdn等）缓存
缓存过期机制
- max-age=<seconds> 资源能够被缓存的最大时间, 是距离请求发起的时间的秒数
- Expires 响应头包含日期/时间，即在此时候之后，响应过期。 现在基本不使用了
  
  如果在Cache-Control响应头设置了 "max-age" 或者 "s-max-age" 指令，那么 Expires 头会被忽略。
```
  // http-date: 一个 HTTP-日期 时间戳 (eg: Wed, 21 Oct 2015 07:28:00 GMT)
  Expires: <http-date>
```
缓存验证确认 must-revalidate

那就意味着缓存在考虑使用一个陈旧的资源时，必须先验证它的状态，已过期的缓存将不被使用
Pragma 头 是HTTP/1.0标准中定义的一个header属性 (等同于 Cache-Control: no-cache),但是HTTP的响应头不支持这个属性

解决方案

实现方案

前端设置
- 添加时间戳 [get请求] (eg: index.css?v=Date.now())
- 请求头设置

服务端设置【基于 Apache/2.4.39】参考

找到 httpd.conf
搜索到下面两个，同时去掉#

LoadModule expires_module modules/mod_expires.so
LoadModule headers_module modules/mod_headers.so

文本后添加

expire 开启

<IfModule expires_module>

  #打开缓存
  ExpiresActive on 
  #css文件缓存7200000/3600/24=83天
  ExpiresByType text/css A7200000

  #js文件缓存83天
  ExpiresByType application/x-javascript A7200000
  ExpiresByType application/javascript A7200000

  #html文件缓存83天
  ExpiresByType text/html A7200000

  #图片文件缓存83天
  ExpiresByType image/jpeg A7200000
  ExpiresByType image/gif A7200000
  ExpiresByType image/png A7200000
  ExpiresByType image/x-icon A7200000

</IfModule>

Cache-Control

<FilesMatch "\.(flv|gif|jpg|jpeg|png|ico|swf)$">
　　Header set Cache-Control "max-age=604800, public"
</FilesMatch>

<FilesMatch "\.(css|js)$">
　Header set Cache-Control "max-age=604800, public"
</FilesMatch>

重启apache

注意：若是报\xe3\x80\x80（空格的问题）在对应行清除空格即可

总结

这个依旧没有我想象的那般随意，也以为着，需要前后一起整，而不是单纯依靠前端即可
上述找了大量资料，若有不当不处还请谅解

posted @ 2019-05-07 14:35 木石心阅读(129) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

木石心

行到水穷处，坐看云起时

http缓存

http缓存

各种类型的缓存

缓存操作的目标

缓存控制

解决方案

总结