浏览器缓存机制(强缓存和协商缓存)

1、为什么需要浏览器缓存？
当我们访问同一个页面时，请求资源、数据都是需要一定的耗时，如果可以将一些资源缓存下来，那么从第二次访问开始，就可以减少加载时间，提高用户体验，也能减轻服务器的压力

2、有哪些缓存？
浏览器缓存分为强缓存和协商缓存，当存在缓存时，客户端第一次向服务器请求数据时，客户端会缓存到内存或者硬盘当中，当第二次获取相同的资源，强缓存和协商缓存的应对方式有所不同。

强缓存：当客户端第二次向服务器请求相同的资源时，不会向服务器发送请求，而是直接从内存/硬盘中间读取

协商缓存：当客户端第二次向服务器请求相同的资源时，先向服务器发送请求"询问"该请求的文件缓存在本地与服务器相比是否更改，如果更改，则更新文件，如果没有就从内存/硬盘中读取

强缓存由服务器的响应头里 cache-control 和 expires 两个字段决定，协商缓存由 last-modified 和 etag两个字段决定。

3、强缓存
(1) expires
http1.0时定义的字段，表示过期时间，格式如 expires: Mon, 29 Mar 2021 01:03:05 GMT ，表示在这个时间之前，如果客户端需要再次获取这个资源，不会向服务器中取，会直接在缓存里读取。

(2) cache-control
http1.1时的字段，表示缓存的时间长度，格式如 cache-control: max-age=2592000，单位为秒，表示可缓存的时间是30天。
cache-contorl 还有其它一些可以设置的值
no-cache，表示不进行强缓存，但不影响协商缓存
no-store，既不强缓存，也不协商缓存

(3) 两者的优先级：cache-control 的优先级要高于 expires

4、协商缓存
(1) last-modified 与 if-modified-since
last-modified 表示该文件上一次被修改的时间，格式如 last-modified: Tue, 04 Aug 2020 14:54:28 GMT，当客户端第一次向服务器第一次请求时，服务器会在响应头上带上最后修改时间 last-modified，等到第二次客户端向服务器请求同样的资源时，客户端会在请求头上的 if-modified-since带上上一次请求的 last-modifed值，服务器对最后修改时间进行比较，如果时间一致，服务器返回304状态码，客户端直接在缓存中读取数据，如果不一致，服务器返回200的状态码，并更新文件

(2) etag 与 if-none-match
etag表示文件的唯一标识，格式如 etag: "5f2976a4-17d"，当客户端第一次向服务器第一次请求时，服务器会在响应头上带上文件唯一标识etag，等到第二次客户端向服务器请求同样的资源时，客户端会在请求头上的 if-none-match带上上一次请求的etag值，服务器对etag进行比较，如果时间一致，服务器返回304状态码，客户端直接在缓存中读取数据，如果不一致，服务器返回200的状态码，并更新文件

(3) 两者有什么区别呢？
etag的出现时为了解决last-modified所存在的一些问题
① 当周期性的更改文件的时间，但是并没有更改文件的内容时，
② last-modifed只能精确到秒，如果一个文件在1秒内更改了多次，那么无法更新到最新的数据，而etag的精确度更高
③ 某些服务器不能精确的得到文件的最后修改时间

(4) 两者如何使用
last-modified与etag是可以一起使用的，服务器会优先验证etag，一致的情况下，才会继续比对last-modified，最后才决定是否返回304

浏览器缓存机制(强缓存和协商缓存)相关推荐

浏览器缓存机制(强缓存和协商缓存)总结
文章目录前言缓存过程的分析强缓存 Expires Cache-Control 协商缓存 Last-Modified和If-Modified-Since ETag和If-None-Match 两者 ...
http状态码304缓存机制(强缓存和协商缓存-304)
前言:好久没写博客了,今天早上闲着没事重新看了下http的304缓存机制.下面我就简单的讲下我的理解吧. 描述:首先我们先明白一点什么是状态码.对于我们开发来说,大家一说起http状态码,都能随口说几 ...
200（强缓存）和304（协商缓存）的区别
本文原链接:https://my.oschina.net/ososchina/blog/494074 https://blog.csdn.net/zl399615007/article/details ...
mysql的缓存机制是什么意思_MySQL缓存机制详解
众所周知,缓存的设置是所有现代计算机系统发挥高性能的重要因素之一.对于MySQL数据库来说,也是得益于MySQL缓存机制,才能够提高MySQL数据库的性能,减少数据的内存占比. MySQL缓存机制简单 ...
HTTP缓存机制及原理（强制缓存/协商缓存）
可以参考文章:https://www.imooc.com/article/267319#comment 主要感觉里面的图很好. 强制缓存(Expires/Cache-Control): 协商缓存: 1 ...
html5 客户端数据缓存机制,深入理解HTML5离线缓存机制
TML5提供了一种离线应用缓存机制,使得网页应用可以离线使用,这种机制在移动端浏览器上支持度非常广,所有版本的android和ios浏览器都能很好的支持.我们可以放心的使用该特性来加速移动端页面的访问 ...
浏览器的缓存机制优点缺点协商缓存和强缓存浏览器缓存过程如何判断强缓存是否过期
缓存的优点: 减少了不必要的数据传输,节省带宽减少服务器的负担,提升网站性能加快了客户端加载网页的速度用户体验友好缺点: 资源如果有更改,会导致客户端不及时更新就会造成用户获取信息滞后当浏览 ...
浏览器缓存机制，强缓存，弱缓存
目录 web缓存类型浏览器缓存规则: 浏览器缓存的控制 cache-control总结 Expires Last-modified & If-modified-since Etag & ...
http缓存（浏览器缓存）——强缓存、协商缓存
定义:利用浏览器存储机制,将一部分数据保存在客户端,从而减少对服务器的请求降低服务器的压力,提升效率. 为什么需要http缓存: 为了减少网络请求的数量和体积,让页面加载更加方便当网络不稳定时,仍可 ...

浏览器缓存机制(强缓存和协商缓存)

浏览器缓存机制(强缓存和协商缓存)相关推荐

最新文章

热门文章