http缓存

本篇文章给大家谈谈http缓存，以及对应的知识点，文章可能有点长，但是希望大家可以阅读完，增长自己的知识，最重要的是希望对各位有所帮助，可以解决了您的问题，不要忘了收藏本站喔。

本文主要内容一览

• 1、前端HTTP缓存
• 2、浏览器缓存http缓存
• 3、浏览器缓存和服务器缓存
• 4、说一下Http缓存策略有什么区别分别解决了什么问题口述1

http缓存

1前端HTTP缓存

在面试的时候总是遇到缓存相关问题，回答总是停留缓存就是从浏览器中获取，不向服务器发送请求，回答的不让面试官满意，索性抽点时间整理一下前端相关的缓存，希望下次回答的时候能够多讲点。

前端缓存分为强缓存和协商缓存，强缓存就是在缓存未失效时，不在请求服务端，协商缓存就是去跟服务器比较是否需要重新获取资源。

强缓存分为两种，Cache-control和Expires，Expires是HTTP1.0的东西，它的值是一个格林时间，比如Expires:Wed,21Oct201507:28:00GMT，由于服务器端和浏览器端的时间差异问题，浏览器比服务器时间快，会导致缓存失效。Cache-control是HTTP1.1时代的新东西，设置的是一个相对时间，Cache-Control:public,max-age=31536000，在31536000秒后才缓存才失效，Cache-control有很多取值。

强缓存在缓存失效内，不会从原始服务器获取新的数据，假如在缓存时段内服务器有资源更新，会导致资源获取不及时。

协商缓存有两组报文

http缓存

2浏览器缓存http缓存

浏览器缓存有两种：强制缓存和协商缓存

向浏览器缓存中查找请求结果，根据【缓存规则】决定是否使用该结果。

强制缓存失效后，携带缓存标识请求服务器，服务器根据缓存标识判断是否使用缓存

当浏览器向服务器发送请求的时候，服务器会将缓存规则放入HTTP响应的报文的HTTP头中和请求结果一起返回给浏览器（ps：下文说的时间点均为类似：SatAug14202111:01:52，秒级）

两个字段：Expires和Cache-Control，优先级：Cache-Control>Expires，客户端比较时间

Expires：HTTP/1.0，返回值为【到期时间点】，再次请求，客户端的时间

Cache-Control：HTTP/1.1，有以下字段

Last-Modified/If-Modified-Since和Etag/If-None-Match，优先级Etag>Last-Modified，服务器比较时间Last-Modified（服务端返回客户端）/If-Modified-Since（客户端传入服务端）：两个值相同，表示：资源文件在服务器最后被修改的时间【时间点】。

Etag（服务端返回客户端）/If-None-Match（客户端传入服务端），两个值相同，为当前资源文件的一个唯一标识(由服务器生成)

Etag什么时候用雅虎禁用了Etag：因为ETag的值和服务器有关，那么对于同样的文件，可能下次请求的时候是发给不同的服务器，结果也会重新发送数据，所以就会影响网页加载速度，增加服务器的压力（但Last-Modified也与服务器有关）主要解决的问题：

浏览器的每个tab都是一个进程两个缓存的地方frommemorycache（内存缓存）和fromdiskcache（硬盘缓存），读取顺序为memory>disk

3浏览器缓存和服务器缓存

一、浏览器缓存

浏览器缓存即http缓存；浏览器缓存根据是否需要向服务器重新发起HTTP请求将缓存过程分为两个部分，分别是 强制缓存 和 协商缓存 。

浏览器第一次请求资源的时候服务器会告诉客户端是否应该缓存资源，根据响应报文中HTTP头的缓存标识，决定是否缓存结果，是则将请求结果和缓存标识存入浏览器缓存中。如下图：

1.强制缓存 ：浏览器会对缓存进行查找，并根据一定的规则确定是否使用缓存。

强制缓存的缓存规则？

HTTP/1.0 Expires 这个字段是绝对时间，比如2018年6月30日12:30，然后在这个时间点之前的请求都会使用浏览器缓存，除非清除了缓存。

这个字段的缺点就是只会同步客户端的时间，这就有可能修改客户端时间导致缓存失效。

HTTP/1.1 cache-Control 这个是1.1的时候替换Expires的，它会有几种取值：

public ：所有内容都将被缓存（客户端和代理服务器都可缓存）

private ：所有内容只有客户端可以缓存， Cache-Control的默认取值

no-cache ：客户端缓存内容，但是是否使用缓存则需要经过协商缓存来验证决定

no-store ：所有内容都不会被缓存，即不使用强制缓存，也不使用协商缓存

max-age=xxx (xxx is numeric) ：缓存内容将在xxx秒后失效

比如max-age=500，则在500秒内再次请求会直接只用缓存。

优先性：cache-Control Expires

如果同时存在，cache-Control会覆盖Expires。

这个字段的缺点就是：

如果资源更新的速度是秒以下单位，那么该缓存是不能被使用的，因为它的时间单位最低是秒。

如果文件是通过服务器动态生成的，那么该方法的更新时间永远是生成的时间，尽管文件可能没有变化，所以起不到缓存的作用。

上图中浏览器缓存中存在该资源的缓存结果，并且没有失效，就会直接使用缓存的内容。

上图中浏览器缓存中没有该资源的缓存结果和标识，就会直接向服务器发起HTTP请求。

2.协商缓存： 浏览器的强制缓存失效后(时间过期)，浏览器携带缓存标识请求服务器，由服务器决定是否使用缓存。

服务器决定的规则？

控制协商缓存的字段有 Last-Modified / If-Modified-Since 和 Etag / If-None-Match。

①Last-Modified 是服务器返回给浏览器的本资源的最后修改时间。

当下次再次请求的时候，浏览器会在请求头中带 If-Modified-Since ,即上次请求下来的 Last-Modified 的值，

然后服务器会用这个值和该资源最后修改的时间比较，如果最后修改时间大于这个值，则会重新请求该资源，返回状态码200。

如果这个值和最后修改时间相等，则会返回304，告诉浏览器继续使用缓存。

② Etag 是服务器返回的一个hash值。

当下次再次请求的时候，浏览器会在请求头中带 If-None-Match ,即上次请求下来的 Etag 值，

然后服务器会用这个值和该资源在服务器的 Etag 值比较，如果一致则会返回304，继续使用缓存；如果不一致，则会重新请求，返回200。

二、服务器缓存

上面是一个简单的流程图：

用户1访问A页面，服务器解析A页面返回给用户1，同时在服务器内存上做一定映射，把A页面缓存在硬盘上面

用户2访问A页面，服务器直接根据内存上的映射找到对应的页面缓存，直接返回给用户2，这样就减少了服务器对同一页面的重复解析

服务器缓存和浏览器缓存的区别：

服务器缓存是把页面缓存到服务器上的硬盘里，而浏览器缓存是把页面缓存到用户自己的电脑里

Nginx服务器

Nginx是一个高性能的HTTP和反向代理服务器。具有非常多的优越性：

在连接高并发的情况下，Nginx是Apache服务器不错的替代品，Nginx在美国是做虚拟主机生意的老板们经常选择的软件平台之一。

Nginx提供了expires、etag、if-modified-since指令来实现浏览器缓存控制。

nginx-sreload#重新加载配置文件

nginx-sreopen#重新打开log文件

nginx-sstop#快速关闭nginx服务

nginx-squit#优雅的关闭nginx服务，等待工作进程处理完所有的请求

Nginx设置静态文件的缓存过期时间

location ~.*.(js|css|html|png|jpg)$ {

expires 3d;

}

expires 3d;//表示缓存3天

expires 3h;//表示缓存3小时

expires max;//表示缓存10年

expires -1;//表示永远过期。

如果设置为-1在js、css等静态文件在没有修改的情况下返回的是http 304，如果修改返回http 200

对于静态资源会自动添加ETag，可以通过添加etag off指令禁止生成ETag。如果是静态文件，那么Last-Modified值为文件的最后修改时间。

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

location ~ .*.(css|js|swf|php|htm|html )$ {

add_header Cache-Control no-store;

add_header Pragma no-cache;

}

nginx gzip压缩

使用 gzip 压缩可以降低网站带宽消耗，同时提升访问速度。

主要在nginx服务端将页面进行压缩，然后在浏览器端进行解压和解析，

目前大多数流行的浏览器都迟滞gzip格式的压缩，所以不用担心。

默认情况下，Nginx的gzip压缩是关闭的，同时，Nginx默认只对text/html进行压缩

gzip on;

ersio #开启gzip压缩输出

gzip_http_vn 1.0 ;#默认1.1

#其中的gzip_http_version的设置，它的默认值是1.1，就是说对HTTP/1.1协议的请求才会进行gzip压缩

#如果我们使用了proxy_pass进行反向代理，那么nginx和后端的upstream server之间是用HTTP/1.0协议通信的。

gzip_vary on ;

#和http头有关系，加个vary头，给代理服务器用的，有的浏览器支持压缩，有的不支持，

#所以避免浪费不支持的也压缩，所以根据客户端的HTTP头来判断，是否需要压缩

gzip_comp_level 6;

#设置gzip压缩等级，等级越底压缩速度越快文件压缩比越小，反之速度越慢文件压缩比越大 1-9

gzip_proxied any;

#Ngnix作为反向代理的时候启用

#expample:gzip_proxied no-cache;

# off – 关闭所有的代理结果数据压缩

# expired – 启用压缩，如果header中包含”Expires”头信息

# no-cache – 启用压缩，如果header中包含”Cache-Control:no-cache”头信息

# no-store – 启用压缩，如果header中包含”Cache-Control:no-store”头信息

# private – 启用压缩，如果header中包含”Cache-Control:private”头信息

# no_last_modified – 启用压缩，如果header中包含”Last_Modified”头信息

# no_etag – 启用压缩，如果header中包含“ETag”头信息

# auth – 启用压缩，如果header中包含“Authorization”头信息

# any – 无条件压缩所有结果数据

gzip_types text/html ;#压缩的文件类型

#设置需要压缩的MIME类型,非设置值不进行压缩

#param:text/html|application/x-javascript|text/css|application/xml

gzip_buffers 16 8k; #设置gzip申请内存的大小,其作用是按块大小的倍数申请内存空间设置gzip申请内存的大小,其作用是按块大小的倍数申请内存空间

#设置gzip申请内存的大小,其作用是按块大小的倍数申请内存空间

# param1:int 增加的倍数

# param2:int(k) 后面单位是k

# example: gzip_buffers 4 8k;

# Disable gzip for certain browsers.

gzip_disable “MSIE [1-6].(?!.*SV1)”; #ie6不支持gzip，需要禁用掉ie6

4说一下Http缓存策略有什么区别分别解决了什么问题口述1

1）浏览器缓存策略

浏览器每次发起请求时，先在本地缓存中查找结果以及缓存标识，根据缓存标识来判断是否使用本地缓存。如果缓存有效，则使用本地缓存；否则，则向服务器发起请求并携带缓存标识。根据是否需向服务器发起HTTP请求，将缓存过程划分为两个部分：强制缓存和协商缓存，强缓优先于协商缓存。

HTTP缓存都是从第二次请求开始的：

3）强缓存-expires

4）强缓存-cache-control

5）协商缓存

6）协商缓存-协商缓存-Last-Modified/If-Modified-since

7）协商缓存-Etag/If-None-match

本文网址：https://www.wzmoban.cn/ui/1323.html

版权声明： 1.本站内容部分为晟匠聚网络编辑原创文章，部分来源于网络，如需转载，请标注来源网站名字和文章出处链接。 2.本站内容为传递信息使用，仅供参考，也不构成相关建议。 3.部分内容和图片来源于网络，如有侵权，请联系我们处理。