一篇文章掌握浏览器缓存机制

655 阅读4分钟

1.什么是CDN?

CDN内容分发网络,CDN就相当于一个缓存服务器的代售点,用最短的请求时间,请求到资源,减轻了服务器的压力。

  详解:简单的理解CDN就是这些代售点(缓存服务器)的承包商,他为买票者提供了便利,帮助他们在最近的地方(最近的CDN节点)用最短的时间(最短的请求时间)买到票(拿到资源),这样去火车站售票大厅排队的人也就少了。也就减轻了售票大厅的压力(起到分流作用,减轻服务器负载压力)。

2.CDN缓存

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

3.CDN 优势

  1. CDN节点解决了跨运营商和跨地域访问的问题,访问延时大大降低。
  2. 大部分请求在CDN边缘节点完成,CDN起到了分流作用,减轻了源服务器的负载。

4.浏览器缓存(http缓存)

浏览器缓存:把从HTTP获取的所有网络资源存储在本地,等待下次访问时不需要重新下载资源

4.1 缓存地址

1.memory cache:存到内存

2.disk cache:存到磁盘

4.2 访问缓存优先级

三级缓存原理

  1. 先在内存中查找,如果有,直接加载。
  2. 如果内存中不存在,则在硬盘中查找,如果有直接加载。
  3. 如果硬盘中也没有,那么就进行网络请求。
  4. 请求获取的资源缓存到硬盘和内存

4.3浏览器缓存的分类

  1. 强缓存
  2. 协商缓存

浏览器再向服务器请求资源时,首先判断是否命中强缓存,再判断是否命中协商缓存!

1.强缓存

浏览器在加载资源时,会先根据本地缓存资源的 header 中的信息判断是否命中强缓存,如果命中则直接使用缓存中的资源不会再向服务器发送请求。

配置: expires cahe-control

1.cahe-control:缓存控制字段
no-cache:需要进行协商缓存,发送请求到服务器确认是否使用缓存。
no-store:禁止使用缓存,每一次都要重新请求数据。
public:可以被所有的用户缓存,客户端和代理服务器(CDN)都可缓存。
private:只有客户端可以缓存


2.expires:缓存时间,文件过期时间

2.协商缓存

当强缓存没有命中的时候,浏览器会发送一个请求到服务器,服务器根据 header 中的部分信息来判断是否命中缓存。如果命中,则返回 304 ,告诉浏览器资源未更新,可使用本地的缓存。

配置:If-Modify-Since,Last-Modify ,Etag/If-None-Match 

服务器收到 If-Modify-Since 后,根据资源的最后修改时间判断是否命中缓存。
如果命中缓存,则返回 304,并且不会返回资源内容,并且不会返回 Last-Modify
ETag 可以保证每一个资源是唯一的,资源变化都会导致 ETag 变化

4.4强缓存与协商缓存的区别

缓存获取资源形式状态吗发送请求到服务器
强缓存从缓存取200(from cache)否,直接从缓存取
协商缓存从缓存取304(not modified)是,通过服务器告知浏览器缓存是否可用

 

5.当浏览器再次访问一个已经访问过的资源时

1.看看是否命中强缓存,如果命中,就直接使用缓存了。

2.如果没有命中强缓存,就发请求到服务器检查是否命中协商缓存。

3.如果命中协商缓存,服务器会返回 304 告诉浏览器使用本地缓存。

4.否则,返回最新的资源。