header设置缓存

‘壹’ Nginx怎样设置浏览器缓存

浏览器缓存（BrowserCaching）

为了加速浏览器，浏览器在用户磁盘上，对最近请求过的文档进行存储。

当访问者再次请求这个页面时，浏览器就可以从本地磁盘显示文档，这样，就可以加速页面的阅览，缓存的方式节约了网络的资源，提高了网络的效率。

浏览器缓存可以通过expires指令输出Header头来实现，expires指令的语法如下

语法：expires[time| epoch | max |off]

默认值：expiresoff

作用域：http、server、location

用途：使用本指令可以控制http应答中的expires和Cache-Control的Header头信息，起到控制页面缓存的作用。

参数说明

Time，可以使用正数或负数，Expires头标的值，将通过当前系统时间加上设定的time值来获得。

epoch，指定expires的值为1January，1970，00:00:01 GMT。

Max，指定expires的值为31December 2037 23:59:59 GMT，Cache-Control的值为10年。

Off，表示不修改Expires和Cache-Control的值。

一个HTML页面，会引用一些JavaScript文件、图片文件、而这些格式的文件很少会被修改，则可以通过expires设置浏览器缓存。

比如，对常见格式的图片、Flash文件在浏览器本地缓存30天，对JS、CSS文件在浏览器本地缓存1小时，代码如下

‘贰’ 关于浏览器缓存

首先浏览器缓存分为 内存缓存 和 文件缓存 。
内存缓存是浏览器自己控制的，不受 Cache-Control 影响，跟计算机内存空间大小有关，并且关闭浏览器就会消失。

文件缓存 就是我们常说的浏览器缓存。
文件缓存分为2种： 强制缓存 和 协商缓存 。

强制缓存 就是通过Header上配置Cache-Control:public,max-age=300这种形式实现的，Cache-Control可以客户端在请求Header配置，也可以服务端在响应Header配置。

强制缓存 比较适合用在变化频率比较低的穗并文件上，比如图片，js，css都可以，通常我们都使用这种缓存再配合文件hash后缀实现缓存文件的即时更新。

协商缓存 是一种服务端控制文件缓存的策略，机猜宏迹制是服务端会根据最新更绝首改时间和文件标识判断响应的时候是否要返回内容。虽然每次都会向服务端发起请求，但是如果服务端确定缓存，会返回很少响应内容。
这种方式比较适合需要频繁更新的文件，需要配合Cache-Control:no-cache阻止强制缓存。另外html不要配置强制缓存，通常我们请求的html文件地址不会加hash。

协商缓存 主要通过2组Header标签让客户端与服务端确认来达成：首先服务端在响应的时候会加上 Last-Modified 和 Etag ，前者表示文件最后更新时间，后者表示文件唯一标识；然后客户端再次请求的时候会带上 If-Modified-Since 和 If-None-Match ，值分别跟服务端的 Last-Modified 和 Etag 一致。

参考：
浏览器缓存

‘叁’ Nginx缓存设置教程

| 这篇文章主要介绍了Nginx缓存设置案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下 |

在开发调试web的时候，经常会碰到因浏览器缓存(cache)而经常要去清空缓存或者强制刷新来测试的烦恼，提供下apache不缓存配置和nginx不缓存配置的设置。在常用的缓存设置里面有两种方式，都是使用add_header来设置：分别为Cache-Control和Pragma。

对于站点中不经常修改的静态内容（如图片，JS，CSS），可以在服务器中设置expires过期时间，控制浏览器缓存，达到有效减小带宽流量，降低服务器压力的目的。

以Nginx服务器为例：

【背景】：Expires是Web服务器响应消息头字段，在响应http请求时告诉浏览器在过期时间前浏览器可以直接从浏览器缓存取数据，而无需再次请求。

【相关资料】

1、Cache-control策略

Cache-Control与Expires的作用一致，都是指明当前资源的有效期，控制浏览器是否直接从浏览器缓存取数据还是重新发请求到服务器取数据。只不过Cache-Control的选择更多，设置更细致，如果同时设置的话，其优先级高于Expires。

http协议头Cache-Control ：

值可以是public、private、no-cache、no- store、no-transform、must-revalidate、proxy-revalidate、max-age

各个消息中的指令含义如下：

Last-Modified/If-Modified-Since

其最终达到的就是等效于设置这三类html缓存技术：

‘肆’ 微信公众号html缓存处理

近期在发版验证时遇到一个问题，微信公众号登入后页面显示的是老的，强制刷新后，再退出重新登入，仍然显示的是老的页面；
经过一番查找得到了解决方案：
（1）公众号放的菜单地址后加 ?version=1.0.0 每次更新页面则更新菜单；
但是这样每次发版还得修改公众号的菜单，多一步很不方便；
于是和前端一块尝试寻找到另一中解决方案：
（2）前端在html的header中加入缓存策略
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<meta http-equiv="Cache" content="no-cache" />
这样就彻底解决了缓存问题；

但是注意，往往遇到此问题时，已经缓存了没有加缓存策略的html文件，需要清除掉缓存，加载新的带缓存策略的html文件，将来才会实时更新；但是也不能让用户每个都清理缓存啊；
于是就要配合第一种解决方法，在菜单链接后面加参数，这样用户侧会重新load新版本的html（微信菜单设置发布后，有将近10分钟的延时），这样配合使用就完美解决了我们的问题；

期间多次尝试发现，微信的缓存策略和页面地址的后缀参数相关，使用相同的后缀，在不设置缓存策略下，就能回到对应的版本，很强大，也很鸡肋