1.浏览器缓存与Nginx缓存

浏览器缓存
优点:
(1)使用有效缓存的时候,没有网络消耗,速度最快;
(2)缓存失效时,针对失效缓存使用的304响应使得网络流量消耗最小化.
缺点:
仅仅提升一个用户的体验.



Nginx缓存
优点:
(1)提升所有用户的体验;
(2)相比浏览器缓存,有效降低上游服务的负载;
(3)通过304响应减少Nginx与上游服务间的流量消耗.
缺点:
用户依然保持着网络消耗.

结合浏览器和Nginx的缓存的优点,我们通常是同时使用浏览器与Nginx缓存的.

2.浏览器缓存的使用

需要了解相关概念:
(1)Etag
(2)If-None-Match                 -
(3)Last-Modified
(4)If-Modified-Since


解释:
(1)Etag
   存在于http的响应中的.是服务器或Nginx向浏览器返回时添加的,它是来标识特定版本的资源,
   使用Etag可以简单地标识一个http的body,相当于其一个指纹.Nginx有一个etag的指令,可以决定
   打开或者关闭etag.当打开etag指令的时候,用root或alias指定静态资源的时候,会返回一个http
   响应头部,包含Etag及其值,在下图中显示了Nginx中etag值的生产规则:以上次修改时间+‘-’+
   头部长度作为其值(重复概率小+性能好),这个值的重复的概率可以说非常小了.
(2)If-None-Match
   Etag维度的条件式请求首部.它会把,比如说我们之前返回了一个Etag,浏览器会把这个Etag缓存起来,
   当浏览器通过时间这个维度判断缓存已经过期了的时候,这时浏览器又想去读取这个资源,浏览器
   很想知道这个资源在缓存过期后有没有修改过这个资源,如果过期后也没有修改这个资源的话,
   浏览器的诉求是Nginx返回304给它,不用把完整的内容给它了(假设这个资源有400M,此时就不需要了),
   那么Nginx如何快速地判断这个资源有没有改过呢?浏览器就会通过If-None-Match这个头部标签里
   填入Etag的值,这样Nginx在收到If-None-Match这个头部标签的时候就会作比较,当Nginx认为Etag的值
   无法和Nginx中任何资源匹配的时候,才会返回200,否则验证失败但返回304.
   更具体的说明可以看一下图片中的讲解.
(3)Last-Modified

(4)If-Modified-Since
   时间维度的条件式请求首部.比如说可能是浏览器中接收到某个资源形成缓存的时间,它是一直保存
   下来的,现在这个缓存失效了,我们把这个时间通过If-Modified-Since这个头部标签发送给Nginx
   想要从Nginx那里得知从那个时间开始资源有没有发生变化,如果资源没有发生变化,那么它希望
   Nginx可以返回一个304给它,不用再把body返回给它了.如果资源改变了,返回200,并且返回完整的
   body.

 

nginx 浏览器播放 mov nginx 浏览器缓存_Nginx

 

nginx 浏览器播放 mov nginx 浏览器缓存_nginx 浏览器播放 mov_02

 

 

nginx 浏览器播放 mov nginx 浏览器缓存_缓存_03

 

3.etag-Nginx内置指令

 

nginx 浏览器播放 mov nginx 浏览器缓存_浏览器缓存_04

4.expires-Nginx内置指令

expire指令用来告诉浏览器缓存什么时候过期,还有not——modifie这个模块.这个模块
用来决策向浏览器返回304还是200,依据是http请求中的header和Nginx中if_modified_since


http://nginx.org/en/docs/http/ngx_http_headers_module.html#expires
Syntax:	expires [modified] time;
expires epoch | max | off;
Default:expires off;
Context:http, server, location, if in location
Enables or disables adding or modifying the “Expires” and “Cache-Control” response 
header fields provided that the response code equals 200, 201 (1.3.10), 204, 206, 301, 
302, 303, 304, 307 (1.1.16, 1.0.13), or 308 (1.13.0). The parameter can be a positive or 
negative time.

The time in the “Expires” field is computed as a sum of the current time and time 
specified in the directive. If the modified parameter is used (0.7.0, 0.6.32) then the 
time is computed as a sum of the file’s modification time and the time specified in the 
directive.

In addition, it is possible to specify a time of day using the “@” prefix (0.7.9, 
0.6.34):

expires @15h30m;
The contents of the “Cache-Control” field depends on the sign of the specified time:

time is negative — “Cache-Control: no-cache”.
time is positive or zero — “Cache-Control: max-age=t”, where t is a time specified in
 the directive, in seconds.
The epoch parameter sets “Expires” to the value “Thu, 01 Jan 1970 00:00:01 GMT”, and 
“Cache-Control” to “no-cache”.

The max parameter sets “Expires” to the value “Thu, 31 Dec 2037 23:55:55 GMT”, and 
“Cache-Control” to 10 years.

The off parameter disables adding or modifying the “Expires” and “Cache-Control” 
response header fields.

The last parameter value can contain variables (1.7.9):

map $sent_http_content_type $expires {
    default         off;
    application/pdf 42d;
    ~image/         max;
}

expires $expires;

注意:Cache-Control这个头部标签是为了防止浏览器和服务器的时间不一致而添加的相对时间.
Catch-Contrl和Expires两个指令非常重要,他们告诉浏览器该如何处理缓存.

 

nginx 浏览器播放 mov nginx 浏览器缓存_缓存_05

5.if_modified_since-Nginx内置指令

所属模块:
not_modified模块

所属模块源码:
/home/muten/module/nginx-1.13.7/src/http/modules/ngx_http_not_modified_filter_module.c 

官方手册:
http://nginx.org/en/docs/http/ngx_http_core_module.html#if_modified_since

Syntax:	if_modified_since off | exact | before;
Default:if_modified_since exact;
Context:http, server, location
This directive appeared in version 0.7.24.

Specifies how to compare modification time of a response with the time in the “If-Modified-
Since” request header field:

off
the “If-Modified-Since” request header field is ignored (0.7.34);
exact
exact match;
before
modification time of a response is less than or equal to the time in the “If-Modified-
Since” request header field.

 

nginx 浏览器播放 mov nginx 浏览器缓存_缓存_06

6.If-Macth头部标签