Max-age是指我们的web中的文件被用户访问(请求)后的存活时间,是个相对的值,相对Request_time(请求时间)。

Expires它比max-age要麻烦点,Expires指定的时间分"相对文件的最后访问时间-Last-Modified"和"绝对修改时间-If-Modified-Since"。

Expires 表示存在时间,允许客户端在这个时间之前不去检查(发请求),等同max-age的效果。但是如果同时存在,则被Cache-Control的max-age覆盖。

location ~* \.(css|js)$ {
       expires 1m;       此时Response Headers中的 Cache-Control: max-age=60 (以为单位)

}

------------------------------------------------------------------------------------------------

expires 指令可以控制 HTTP 应答中的“ Expires ”和“ Cache-Control ”的头标(起到控制页面缓存的作用)

语法:expires [time|epoch|max|off]
默认值:off    -----不修改“Expires”和"Cache-Control"的值

作用域: http, server, location

expires指令控制HTTP应答中的“Expires”和“Cache-Control”Header头部信息,启动控制页面缓存的作用
time:可以使用正数或负数。“Expires”头标的值将通过当前系统时间加上设定time值来设定。

为epoch时, 指定“Expires”的值为 1  January, 1970, 00:00:01 GMT。

为max时, 指定“Expires”的值为 31  December 2037 23:59:59 GMT,“Cache-Control”的值为10年。

-1 指定“Expires”的值为 服务器当前时间 -1s,即永远过期

“Cache-Control”头标的值由您指定的时间来决定:

time值还控制"Cache-Control"的值:
负数表示no-cache
正数或零表示max-age=time

cache-control :
max-age > 0  时 直接从本地浏览器缓存中提取 
max-age <=0 时 每次向server发送http请求确认该资源是否有修改。有的话 返回200 ,无的话 返回304

expires使用了特定的时间,并且要求服务器和客户端的是中严格同步。
而Cache-Control是用max-age指令指定组件被缓存多久。
对于不支持http1.1的浏览器,还是需要expires来控制。所以最好能指定两个响应头。但HTTP规范规定max-age指令将重写expires头。

一般用于页面变化不是很快的时候,如果缓存过期了,浏览器在重用它之前会首先确认他是否有效(是否变更过),就是一个“条件GET请求”,如果有效,返回304状态码。expires通过Last-Modified响应头来确定。如图:

第一次访问时的请求Header,并且返回200

Etag:指示资源的状态唯一标识

第二次访问时的请示Header:

这时返回的状态码是304,而在请求中比第一次多了If-Modified-Since头,和原始服务器中的Last-Modified作比较,所以实现浏览器缓存并判断是否过期。

简单的说,Last-Modified 与If-Modified-Since 都是用于记录页面最后修改时间的 HTTP 头信息,只是Last-Modified 是由服务器往客户端发送的 HTTP 头,而 If-Modified-Since则是由客户端往服务器发送的头,可以看到,再次请求本地存在的 cache 页面时,客户端会通过 If-Modified-Since头将先前服务器端发过来的 Last-Modified最后修改时间戳发送回去,这是为了让服务器端进行验证,通过这个时间戳判断客户端的页面是否是最新的,如果不是最新的,则返回新的内容,如果是最新的,则返回304告诉客户端其本地cache的页面是最新的,于是客户端就可以直接从本地加载页面了,这样在网络上传输的数据就会大大减少,同时也减轻了服务器的负担。

如果只是用浏览器打开,那么浏览器会去判断这个资源在缓存里有没有,如果有的话,会去判断max-age,看看过期没有,如果没有过期,则直接读缓存,根本不会和服务器进行交互,换句话说,断网都能打开,就和本地跑一样!如果已经过期了,那就去服务器请求,等待服务器响应,这是很费时间的,服务器如果发现资源没有改变过,那么就会返回304,告诉浏览器,我没变过,你去读缓存吧,于是浏览器也不用从服务器拉数据了。

经测试如果缓存未过期的情况下,在已打开的页面进行任何刷新操作的话,此时仍会往服务器发送GET请求。只有在新打开的页面,才会读取本地缓存内容。

如果不想让代理或浏览器缓存,加no-cache参数或private参数:
# expires 1d;
add_header Cache-Control no-cache;
add_header Cache-Control private;
这样浏览器F5刷新时,每次返回的依然是200,而不是304.

Nginx使用Expires增加浏览器缓存加速的更多相关文章

  1. Nginx使用Expires增加浏览器缓存加速(转)

    转载自:Nginx使用Expires增加浏览器缓存加速 Nginx可以更改HTTP头部,这个是Web服务器必须的,当然Nginx更可以支持在HTTP头部中添加Expires等相关信息,增强浏览器缓存, ...

  2. Nginx设置expires设定页面缓存时间 不缓存或一直使用缓存

    配置expires expires起到控制页面缓存的作用,合理的配置expires可以减少很多服务器的请求 要配置expires,可以在http段中或者server段中或者location段中加入 l ...

  3. vue-cli 创建的项目,在 nginx 上配置启用浏览器缓存

    nginx 配置,关键参数: server { listen 80; server_name xxx.xxx.xxx.xxx; charset utf-8; root /home/xxx/dist/; ...

  4. nginx优化:使用expires在浏览器端缓存静态文件

    一,nginx中expires指令的作用 网站的图片等静态文件一旦发布,通常很少改动, 为了减小对服务器请求的压力,提高用户浏览速度, 我们可以设置nginx中的expires, 使用户访问一次后,将 ...

  5. 【nginx网站性能优化篇(1)】gzip压缩与expire浏览器缓存

    gzip压缩 概述 网页在服务器端经过了gzip或者其他格式的压缩后的输出明显减少了content-length字节,当访问过百万时,这些减少的字节就会变为客观的流量给节约下来;从而减轻服务器的压力以 ...

  6. nginx优化--gzip压缩与expire浏览器缓存

    gzip压缩 概述 网页在服务器端经过了gzip或者其他格式的压缩后的输出明显减少了content-length字节,当访问过百万时,这些减少的字节就会变为客观的流量给节约下来;从而减轻服务器的压力以 ...

  7. 浏览器缓存相关的Http头介绍:Expires,Cache-Control,Last-Modified,ETag

    转自:http://www.path8.net/tn/archives/2745 缓存对于web开发有重要作用,尤其是大负荷web系统开发中. 缓存分很多种:服务器缓存,第三方缓存,浏览器缓存等.其中 ...

  8. Nginx实践篇(2)- Nginx作为静态资源web服务 - 控制浏览器缓存、防盗链

    一.控制浏览器缓存 1. 浏览器缓存简介 浏览器缓存遵循HTTP协议定义的缓存机制(如:Expires;Cache-control等). 当浏览器无缓存时,请求响应流程 当浏览器有缓存时,请求响应流程 ...

  9. 浏览器缓存之Expires Etag Last-Modified max-age详解

    前段时间去面试移动端的H5开发工程师,在最后面试的时候被问到了max-age Expires Etag有什么不同,在什么情况下应用,当时乱编了一通,自我感觉良好,结果…… 大家懂得,现在讲他们几个的区 ...

随机推荐

  1. Tomcat启动报错 Could not reserve enough space for object heap

    报错信息: Error occurred during initialization of VM Could not reserve enough space for object heap Coul ...

  2. HttpWebRequest-header设置

    http://www.cnblogs.com/yczz/archive/2012/06/01/2530484.html http://blog.csdn.net/htsnoopy/article/de ...

  3. [AS3.0] NetConnection.Connect.Rejected 解决办法

    以下是运用FMS录制视频的一段代码: package { import flash.display.Sprite; import flash.events.AsyncErrorEvent; impor ...

  4. VS2013各个版本秘钥

    Visual Studio Ultimate 2013 KEY(密钥):BWG7X-J98B3-W34RT-33B3R-JVYW9 Visual Studio Premium 2013 KEY(密钥) ...

  5. Flask 的 Context 机制

    转自https://blog.tonyseek.com/post/the-context-mechanism-of-flask/ Flask 的 Context 机制 2014 年 07 月 21 日 ...

  6. 一次完整的HTTP请求流程

    HTTP通信机制是在一次完整的HTTP通信过程中,Web浏览器与Web服务器之间将完成下列7个步骤: 1. 建立TCP连接: 在HTTP工作开始之前,Web浏览器首先要通过网络与Web服务器建立连接, ...

  7. 使用智能指针来管理对象 (基于RAII)

    ////一个简单的防止内存泄露的例子//void test() { //使用RAII的特性管理资源 //当智能指针unique_ptr被销毁时,它指向的对象也将被销毁 //这里test函数返回后 p将 ...

  8. Pycharm注册码(2016.2)

    43B4A73YYJ-eyJsaWNlbnNlSWQiOiI0M0I0QTczWVlKIiwibGljZW5zZWVOYW1lIjoibGFuIHl1IiwiYXNzaWduZWVOYW1lIjoiI ...

  9. 开源的运维机器人hubot原理

  10. 深入理解Oracle的并行操作-转载

    转载:http://czmmiao.iteye.com/blog/1487568 并行(Parallel)和OLAP系统 并行的实现机制是:首先,Oracle会创建一个进程用于协调并行服务进程之间的信 ...