浏览器缓存和服务器缓存

一、浏览器缓存

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

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

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

强制缓存的缓存规则？

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

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

HTTP/11 cache-Control       这个是11的时候替换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 -s reload#重新加载配置文件 

nginx -s reopen#重新打开log文件 

nginx -s stop#快速关闭nginx服务 

nginx -s quit #优雅的关闭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 10 ;#默认11

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

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

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

1、切换到root用户：sudosu按回车键清理缓存。

2、按步骤清除日志缓存，按回车键。

3、清理其他缓存（会同时清理掉浏览器的收藏和历史记录，可以提前备份）三个指令依次执行，右键复制粘贴到终端中回车即可。

java web开发缓存方案，ehcache和redis各有优劣势，对比如下：

1、适合使用ehcache的场景：

选用Ehcache作为数据存储服务器，Ehcache也是基于内存存储，支持定时持久化功能，非常适合存储像计数器这种小数据类型。处理Http请求使用Tomcat容器，结构图如下：

实现原理：处理逻辑采用一个servlet实现，并且在这个servlet中通过一致性Hash从Ehcache中获取计数器值。

2、高并发并且对实时性要求高的场合下使用redis

redis

 redis是在memcache之后编写的，大家经常把这两者做比较，如果说它是个key-value store 的话但是它具有丰富的数据类型，我想暂时把它叫做缓存数据流中心，就像现在物流中心那样，order、package、store、classification、distribute、end。现在还很流行的LAMP PHP架构 不知道和 redis+mysql 或者 redis + mongodb的性能比较（听群里的人说mongodb分片不稳定）。

先说说reidis的特性

1 支持持久化

     redis的本地持久化支持两种方式：RDB和AOF。RDB 在redisconf配置文件里配置持久化触发器，AOF指的是redis没增加一条记录都会保存到持久化文件中（保存的是这条记录的生成命令），如果不是用redis做DB用的话还会不要开AOF ，数据太庞大了，重启恢复的时候非常麻烦。

2丰富的数据类型

    redis 支持 String 、Lists、sets、sorted sets、hashes 多种数据类型,新浪微博会使用redis做nosql主要也是它具有这些类型，时间排序、职能排序、我的微博、发给我的这些功能List 和 sorted set 的强大操作功能息息相关。

3高性能

   这点跟memcache很想象，内存操作的级别是毫秒级的比硬盘操作秒级操作自然高效不少，较少了磁头寻道、数据读取、页面交换这些高开销的操作！这也是NOSQL冒出来的原因吧，应该是高性能

  是基于RDBMS的衍生产品，虽然RDBMS也具有缓存结构，但是始终在app层面不是我们想要的那么操控的。

4replication

    redis提供主从复制方案，跟mysql一样增量复制而且复制的实现都很相似，这个复制跟AOF有点类似复制的是新增记录命令，主库新增记录将新增脚本发送给从库，从库根据脚本生成记录，这个过程非常快，就看网络了，一般主从都是在同一个局域网，所以可以说redis的主从近似及时同步，同事它还支持一主多从，动态添加从库，从库数量没有限制。 主从库搭建，我觉得还是采用网状模式，如果使用链式（master-slave-slave-slave-slave·····）如果第一个slave出现宕机重启，首先从master 接收 数据恢复脚本，这个是阻塞的，如果主库数据几TB的情况恢复过程得花上一段时间，在这个过程中其他的slave就无法和主库同步了。

5更新快

   这点好像从我接触到redis到目前为止 已经发了大版本就4个，小版本没算过。redis作者是个非常积极的人，无论是邮件提问还是论坛发帖，他都能及时耐心的为你解答，维护度很高。有人维护的话，让我们用的也省心和放心。目前作者对redis 的主导开发方向是redis的集群方向。

缓存问题在web前端编程开发领域中是一个非常重要的技术问题，下面我们就一起来了解一下，关于web缓存我们都需要了解哪些知识。

缓存优点

通常所说的Web缓存指的是可以自动保存常见http请求副本的http设备。对于前端开发者来说，浏览器充当了重要角色。除此外常见的还有各种各样的代理服务器也可以做缓存。当Web请求到达缓存时，缓存从本地副本中提取这个副本内容而不需要经过服务器。这带来了以下优点：

缓存减少了冗余的数据传输，节省流量

缓存缓解了带宽瓶颈问题。不需要更多的带宽就能更快加载页面

缓存缓解了瞬间拥塞，降低了对原始服务器的要求。

缓存降低了距离延时，因为从较远的地方加载页面会更慢一些。

缓存种类

缓存可以是单个用户专用的，也可以是多个用户共享的。专用缓存被称为私有缓存，共享的缓存被称为公有缓存。

私有缓存

私有缓存只针对专有用户，所以不需要很大空间，廉价。Web浏览器中有内建的私有缓存——大多数浏览器都会将常用资源缓存在你的个人电脑的磁盘和内存中。

公有缓存

公有缓存是特殊的共享代理服务器，被称为缓存代理服务器或代理缓存(反向代理的一种用途)。公有缓存会接受来自多个用户的访问，所以通过它能够更好的减少冗余流量。

新鲜度限值

HTTP通过缓存将服务器资源的副本保留一段时间，这段时间称为新鲜度限值。这在一段时间内请求相同资源不会再通过服务器。HTTP协议中Cache-Control和Expires可以用来设置新鲜度的限值，前者是HTTP11中新增的响应头，后者是HTTP10中的响应头。电脑培训发现二者所做的事时都是相同的，但由于Cache-Control使用的是相对时间，而Expires可能存在客户端与服务器端时间不一样的问题，所以我们更倾向于选择Cache-Control。

有dns的地方,就有缓存。浏览器、操作系统、Local DNS、根域名服务器，它们都会对DNS结果做一定程度的缓存。

DNS查询过程如下:

首先搜索浏览器自身的DNS缓存,如果存在，则域名解析到此完成。

如果浏览器自身的缓存里面没有找到对应的条目，那么会尝试读取操作系统的hosts文件看是否存在对应的映射关系,如果存在，则域名解析到此完成。

如果本地hosts文件不存在映射关系，则查找本地DNS服务器(ISP服务器,或者自己手动设置的DNS服务器),如果存在,域名到此解析完成。

如果本地DNS服务器还没找到的话,它就会向根服务器发出请求,进行递归查询。

浏览器本地缓存失效后，浏览器会向CDN边缘节点发起请求。类似浏览器缓存,CDN边缘节点也存在着一套缓存机制。CDN边缘节点缓存策略因服务商不同而不同，但一般都会遵循http标准协议，通过http响应头中的

Cache-control: max-age 的字段来设置CDN边缘节点数据缓存时间。

当浏览器向CDN节点请求数据时，CDN节点会判断缓存数据是否过期，若缓存数据并没有过期，则直接将缓存数据返回给客户端；否则，CDN节点就会向服务器发出回源请求，从服务器拉取最新数据，更新本地缓存，并将最新数据返回给客户端。 CDN服务商一般会提供基于文件后缀、目录多个维度来指定CDN缓存时间，为用户提供更精细化的缓存管理。

CDN 优势

CDN节点解决了跨运营商和跨地域访问的问题，访问延时大大降低。

大部分请求在CDN边缘节点完成，CDN起到了分流作用，减轻了源服务器的负载。

http请求报文（request）

请求行

请求方法  空格  URL 空格  协议版本 回车符 换行符

请求头（通用信息头、请求头、实体头）

头部字段名 冒号  值  回车键 换行符

头部字段名 冒号  值  回车键 换行符

空行

回车符   换行符

实体主体（只有post请求有）

主体

http响应报文（response）

状态行

协议版本  空格  状态码 空格  状态码描述 回车符 换行符

响应头部

头部字段名 冒号  值   回车符 换行符

头部字段名 冒号  值   回车符 换行符

空行

回车符   换行符

响应正文

正文

浏览器初次向服务器发起请求后拿到请求结果，会根据响应报文中HTTP头的缓存标识，决定是否缓存返回的结果，是则将请求结果和缓存标识存入浏览器缓存中

浏览器每次发起请求，都会现在浏览器缓存中查找该请求的结果以及缓存标识

浏览器                浏览器缓存        服务器

——————第一次发起http请求——————>

<——没有该请求的缓存结果和缓存标识————

——————————————发起http请求——————————————>

<——————————返回该请求结果和缓存规则————————————

——将请求结果和缓存标识存入浏览器缓存——>

强制缓存就是向浏览器缓存查找结果，并根据该结果的缓存规则来决定是否使用该缓存结果的过程

强制缓存的情况分为三种：

1、不存在该缓存结果和缓存标识，强制缓存失效，直接向服务器发起请求

2、存在该缓存结果和缓存标识，但结果已经失效，强制缓存失效，使用协商缓存

3、存在该缓存结果和缓存标识，且该结果没有失效，强制缓存生效，直接返回该结果

控制强制缓存的字段：Expires，Cache-Control

Expires 是 HTTP/10 控制缓存的字段，值为服务器返回该请求的结果缓存时间

即再次发送请求是，客户端时间 小于 Expires的值，直接使用缓存结果

Cache-Control 是HTTP/11的规则，主要用于控制网页缓存，主要取值为：

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

private：所有内容只有客户端可以缓存（默认值）

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

no-store：即不使用强制缓存，也不使用协商缓存

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

Expires 是一个绝对值

Cache-Control 中 max-age 是相对值，解决了 Expires时期 服务端与客户端 可能出现时间差的问题

注：Expires和Cache-Control同时存在时，只有Cache-Control生效

协商缓存就是强制缓存失效后，浏览器携带缓存标识向服务器发起请求，由服务器根据缓存标识决定是否使用缓存的过程

协商缓存的两种情况：

1、协商缓存生效，返回304，继续使用缓存

过程：

浏览器                 浏览器缓存     服务器

————————发起http请求————————>

<——该请求的缓存结果失效，只返回缓存标识——

————————携带该资源的缓存标识，发起http请求————————>

<—————————————304，该资源无更新————————————

——————获取该请求的缓存结果——————>

<——————返回该请求的缓存结果——————

2、协商缓存失败，返回200和请求结果

过程：

浏览器                 浏览器缓存     服务器

————————发起http请求————————>

<——该请求的缓存结果失效，只返回缓存标识——

————————携带该资源的缓存标识，发起http请求————————>

<————————200，资源已更新，重新返回请求和结果———————

——将该请求结果和缓存标识存入浏览器缓存中—>

协商缓存的标识也是在响应报文的HTTP头中和请求结果一起返回给浏览器的

控制协商缓存的字段：

(1) Last-Modified/If-Modified-Since：Last-Modified是服务器响应请求是，返回该资源文件在服务器最后被修改的时间；If-Modified-Since再次发起请求时，携带上次返回的Last-Modified的值，服务器将该字段值与该资源最后修改时间对比，决定是否用缓存

(2)Etag/If-None-Match：Etag服务器响应请求时，返回当前资源文件的一个唯一标识，由服务器生成之；If-None-Match是再次发起请求时，携带上次返回的唯一标识Etag的值，服务器收到后，将该字段值与该资源在服务器上的Etag对比，一致 则返回304，否则返回200

注：Etag/If-None-Match优先级高于Last-Modified/If-Modified-Since，同时存在时只有Etag/If-None-Match生效

浏览器缓存分为：内存缓存 和 硬盘缓存

内存缓存特性：

(1)快速读取：内存缓存会将编译解析后的文件，存入该进程的内存中，便于下次运行时快速读取

(2)时效性：一旦关闭进程，进程内存清空

硬盘缓存特性：

永久性：直接写入硬盘文件中

复杂、缓慢：读取缓存对该缓存存放的硬盘文件进行I/O操作，重新解析

from memory cache：使用内存中的缓存

from disk cache：使用硬盘中的缓存

浏览器读取顺序：memory ——> disk

浏览器将js和等文件解析执行后直接存入内存缓存中，F5刷新页面时，from memory cache(使用内存中的缓存)

css文件存入硬盘中，F5刷新页面时，from disk cache(使用硬盘中的缓存)

参考文章

https://segmentfaultcom/a/1190000017962411

https://wwwcnblogscom/chengxs/p/10396066html

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

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

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

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

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

Expires ：HTTP/10，返回值为到期时间点，再次请求，客户端的时间< Expires，直接用缓存（ps：客户端与服务器端时间可能存在误差，出问题）

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

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都是一个进程

两个缓存的地方 from memory cache（内存缓存） 和 from disk cache（硬盘缓存） ，读取顺序为memory > disk