精华内容
下载资源
问答
  • 强缓存和协商缓存浏览器缓存是浏览器将用户请求过静态资源存储到电脑本地磁盘中,当再次访问时,就可以直接从本地缓存中加载而不需要去向服务器请求了。但是缓存也有缺点,如果服务端资源更新了,客户端没有强制...

    缓存是前端面试的一个常见知识点,下面对于实际项目中如何进行缓存的设置给出方案。

    强缓存和协商缓存

    浏览器缓存是浏览器将用户请求过的静态资源存储到电脑本地磁盘中,当再次访问时,就可以直接从本地缓存中加载而不需要去向服务器请求了。但是缓存也有缺点,如果服务端资源更新了,客户端没有强制刷新的情况下,看到的内容还是旧的。所以,前端需要根据项目中各个资源的实际情况,做出合理的缓存策略。这就出现了强缓存和协商缓存。

    强缓存:通过http的response header中的Cache-Control和Expire两个字段控制。其中Expire基本上已经淘汰了,不用管,主要看Cache-Control的几个取值含义:

    private:仅浏览器可以缓存

    public:浏览器和代理服务器都可以缓存

    max-age=xxx:过期时间

    no-cache:不进行强缓存

    no-store:不强缓存,也不协商缓存

    强缓存步骤:1,第一次请求文件时,缓存中没有该信息,直接请求服务器。

    2,服务器返回请求的文件,并且http response header中cache-control为max-age=xxx

    3,再次请求该文件时,判断是否过期,如果没有过期,直接读取本地缓存,如果已经过期了,则进行协商缓存。

    协商缓存:它的触发条件有两点,其一是Cache-Control 的值为 no-cache,其二是max-age 过期了。协商缓存中还有两个重要的规则:

    ETag:每个文件有一个,改动文件了就变了

    Last-Modified:文件的修改时间

    协商缓存步骤:1,请求资源时,要同时比较本地该资源的ETag和Last-Modified(主要是ETag)和服务器最新资源该资源的ETag

    2,如果资源没有被更新,返回304状态码,浏览器读取本地缓存

    3,如果资源已经被更新,返回200状态码,浏览器获取服务器最新资源。

    最大的问题就是每次都要向服务器验证一下缓存的有效性,但是这就使缓存失去了意义。

    所以,给出一个比较合理的缓存方案:

    HTML:使用协商缓存

    CSS&JS&图片:使用强缓存

    ETag计算

    Nginx

    Nginx官方默认的ETag计算方式是为"文件最后修改时间16进制-文件长度16进制"。例:ETag: “59e72c84-2404”

    Express

    Express框架使用了serve-static中间件来配置缓存方案,其中,使用了一个叫etag的npm包来实现etag计算。

    后端需要怎么设置

    以nodejs为例,如果需要浏览器强缓存,可以这样设置:

    res.setHeader('Cache-Control', 'public, max-age=xxx');

    如果需要协商缓存,则可以这样设置:

    res.setHeader('Cache-Control', 'public, max-age=0');

    res.setHeader('Last-Modified', xxx);

    res.setHeader('ETag', xxx);

    展开全文
  • 上面说到,使用强缓存时,浏览器不会发送请求到服务端,根据设置缓存时间浏览器一直从缓存中获取资源,在这期间若资源产生了变化,浏览器就在缓存期内就一直得不到最新资源,那么如何防止这种事情发生呢?...

    上面说到,使用强缓存时,浏览器不会发送请求到服务端,根据设置的缓存时间浏览器一直从缓存中获取资源,在这期间若资源产生了变化,浏览器就在缓存期内就一直得不到最新的资源,那么如何防止这种事情发生呢?

    通过更新页面中引用的资源路径,让浏览器主动放弃缓存,加载新资源。

    前端常常后面加上版本号和一些hash值重新的读取

    二、介绍协商缓存

    协商缓存都是由服务器来确定缓存资源是否可用的,所以客户端与服务器端要通过某种标识来进行通信,从而让服务器判断请求资源是否可以缓存访问,这主要涉及到下面两组header字段,这两组搭档都是成对出现的,即第一次请求的响应头带上某个字段(Last-Modified或者Etag),则后续请求则会带上对应的请求字段(If-Modified-Since或者If-None-Match),若响应头没有Last-Modified或者Etag字段,则请求头也不会有对应的字段。

    Last-Modified/If-Modified-Since

    二者的值都是GMT格式的时间字符串,具体过程:浏览器第一次跟服务器请求一个资源,服务器在返回这个资源的同时,在respone的header加上Last-Modified的header,这个header表示这个资源在服务器上的最后修改时间

    浏览器再次跟服务器请求这个资源时,在request的header上加上If-Modified-Since的header,这个header的值就是上一次请求时返回的Last-Modified的值

    服务器再次收到资源请求时,根据浏览器传过来If-Modified-Since和资源在服务器上的最后修改时间判断资源是否有变化,如果没有变化则返回304 Not Modified,但是不会返回资源内容;如果有变化,就正常返回资源内容。当服务器返回304 Not Modified的响应时,response header中不会再添加Last-Modified的header,因为既然资源没有变化,那么Last-Modified也就不会改变,这是服务器返回304时的response header

    浏览器收到304的响应后,就会从缓存中加载资源

    如果协商缓存没有命中,浏览器直接从服务器加载资源时,Last-Modified的Header在重新加载的时候会被更新,下次请求时,If-Modified-Since会启用上次返回的Last-Modified值

    Etag/If-None-Match

    这两个值是由服务器生成的每个资源的唯一标识字符串,只要资源有变化就这个值就会改变;其判断过程与Last-Modified/If-Modified-Since类似,与Last-Modified不一样的是,当服务器返回304 Not Modified的响应时,由于ETag重新生成过,response header中还会把这个ETag返回,即使这个ETag跟之前的没有变化。

    3、既生Last-Modified何生Etag

    你可能会觉得使用Last-Modified已经足以让浏览器知道本地的缓存副本是否足够新,为什么还需要Etag呢?HTTP1.1中Etag的出现主要是为了解决几个Last-Modified比较难解决的问题:一些文件也许会周期性的更改,但是他的内容并不改变(仅仅改变的修改时间),这个时候我们并不希望客户端认为这个文件被修改了,而重新GET;

    某些文件修改非常频繁,比如在秒以下的时间内进行修改,(比方说1s内修改了N次),If-Modified-Since能检查到的粒度是s级的,这种修改无法判断(或者说UNIX记录MTIME只能精确到秒);

    某些服务器不能精确的得到文件的最后修改时间。

    这时,利用Etag能够更加准确的控制缓存,因为Etag是服务器自动生成或者由开发者生成的对应资源在服务器端的唯一标识符。

    Last-Modified与ETag是可以一起使用的,服务器会优先验证ETag,一致的情况下,才会继续比对Last-Modified,最后才决定是否返回304。

    4,代码案例

    if (etag === '777') {

    response.writeHead(304, {

    'Content-Type': 'text/javascript',

    'Cache-control': 'max-age=200000,no-cache',

    'last-Modified': '123',

    'Etag': '777',

    })

    response.end('');

    } else {

    response.writeHead(200, {

    'Content-Type': 'text/javascript',

    'Cache-control': 'max-age=200000,no-cache',

    'last-Modified': '123',

    'Etag': '777',

    })

    response.end('fffff');

    }

    三、强缓存与协商缓存的区别,可以用下表来进行描述:

    获取资源形式状态码发送请求到服务器

    强缓存从缓存取200(from cache)否,直接从缓存取

    协商缓存从缓存取304(not modified)是,正如其名,通过服务器来告知缓存是否可用

    展开全文
  • 缓存的分类及区别浏览器的缓存分为强缓存和协商缓存,在一定情况下强缓存生效,在一定情况下采用协商缓存策略,具体流程参考下图:PS: 浏览器器的缓存目标不在本文之中整体流程图我把前面浏览器缓存的流程进行了...

    浏览器缓存是实现HTTP协议中缓存的一种方式,除此之外还有CDN缓存、反向代理缓存和负载均衡缓存等,此处的浏览器缓存为Web缓存。

    缓存的分类及区别

    浏览器的缓存分为强缓存和协商缓存,在一定情况下强缓存生效,在一定情况下采用协商缓存策略,具体流程参考下图:

    PS: 浏览器器的缓存目标不在本文之中

    整体流程图

    我把前面浏览器缓存的流程进行了步骤划分,从①~⑧在下面依次说明:

    步骤分析

    用户发起一个HTTP请求,例如进入 https://blog.3gxk.net,之后会因为script,img等标签的缘故会多次发起请求,在这些请求中就会进入下面的步骤。

    浏览器会把这些请求给拦截下来,进行缓存判断,如果缓存有效的话就无需发起真实的请求。

    判断强缓存是否生效,如果是第一次发起请求自然就没有缓存一说,强缓存的命中条件必须进行过首次请求。在第一次请求后响应头中会带有Expires或者Cache-Control字段,或者两者都存在,同时存在时优先级Cache-Control>Expires。Expires: HTTP/1.0中的控制字段,其值为该资源的过期时间

    Cache-Control: HTTP/1.1中的控制字段,其值有多个选项:public: 表明响应可以被任何对象(包括:发送请求的客户端,代理服务器,等等)缓存,即使是通常不可缓存的内容

    private:浏览器默认值,表明响应只能被单个用户缓存,不能作为共享缓存

    no-cache:在发布缓存副本之前,强制要求缓存把请求提交给原始服务器进行验证(即直接进行协商缓存判断)。

    no-store:缓存不应存储有关客户端请求或服务器响应的任何内容(即不进行任何缓存,包括强缓存和协商缓存)。

    max-age=:设置缓存存储的最大周期,超过这个时间缓存被认为过期(单位秒)。时间是相对于请求的时间。

    前四项值可以与第五项的值并列使用,如Cache-Control:public, max-age=600表示缓存所有内容并且在600秒(相对于请求时间)之后过期。

    private和public仅存在HTTP响应头中,其余字段可在请求头也可在响应头中。

    所以在Cache-Control的值为no-cache或者缓存时间失效时才会进入协商缓存的判断。

    如果强缓存的判断生效,例如Cache-Control字段中max-age属性值代表的时间没有到期,或者Expires字段表示的时间没有到期时会进入该步骤,此时浏览器不会真实的发送请求,只会在缓存的获取数据。不过HTTP状态码依然是200

    ⑤⑥⑦⑧

    如果强缓存没有生效,或者主动进入协商缓存步骤,则此时浏览器会携带一些控制字段发送真实的请求。控制字段也是两组方式:Last-Modified / If-Modified-Since和Etag / If-None-Match,优先级Etag / If-None-Match>Last-Modified / If-Modified-Since。

    这两对控制字段,If-Modified-Since和If-None-Match在HTTP请求头中,Last-Modified和Etag存在HTTP响应头。Last-Modified / If-Modified-Since:两个字段的值都为时间,第一次请求时服务器会返回是该资源最后一次修改的时间,待浏览器下次请求时携带该时间,服务器进行检测,如果相同则服务器返回HTTP 304,返回内容为空,此时浏览器采用本地缓存数据。如果时间不同则表示该资源有更新,此时服务器返回HTTP 200,同时返回新的资源内容。

    Etag / If-None-Match:两个字段是字符串,由服务器生成的唯一标识,大多数情况下是该资源的摘要(如果文件很大,如何快速计算摘要又是另一门学问了),浏览器在下次请求时依然携带该摘要,服务器进行计算后判断内容是否有更新,再决定返回什么HTTP状态码(和上述相同)。

    至于为何会有两种方式来进行协商缓存,是因为通过时间判断不精确,它的精度为秒级。而 Etag 需要计算,消耗会更大,所以他们各有利弊吧。

    结语

    文章为个人理解,如有和事实不符请在留言区指出,谢谢。

    参考资料:

    展开全文
  • 面试公司:阿里面试环节:一面问题:说一说你对浏览器强缓存和协商缓存的理解答案:这里说的缓存是指浏览器(客户端)在本地磁盘中对访问过的资源保存的副本文件。浏览器缓存主要有以下几个优点:减少重复数据请求,...

    面试公司:

    阿里

    面试环节:

    一面

    问题:

    说一说你对浏览器强缓存和协商缓存的理解

    6f30d70be46ef6eacce961e04576639b.png

    答案:

    这里说的缓存是指浏览器(客户端)在本地磁盘中对访问过的资源保存的副本文件。

    浏览器缓存主要有以下几个优点:

    1. 减少重复数据请求,避免通过网络再次加载资源,节省流量。
    2. 降低服务器的压力,提升网站性能。
    3. 加快客户端加载网页的速度, 提升用户体验。

    浏览器缓存分为强缓存和协商缓存,两者有两个比较明显的区别:

    1. 如果浏览器命中强缓存,则不需要给服务器发请求;而协商缓存最终由服务器来决定是否使用缓存,即客户端与服务器之间存在一次通信。
    2. 在 chrome 中强缓存(虽然没有发出真实的 http 请求)的请求状态码返回是 200 (from cache);而协商缓存如果命中走缓存的话,请求的状态码是 304 (not modified)。 不同浏览器的策略不同,在 Fire Fox 中,from cache 状态码是 304.

    其中 from cache 会分为 from disk cache 和 from memory cache. 从内存中获取最快,但是是 session 级别的缓存,关闭浏览器之后就没有了。

    679d12138493cf2fdbd15111ac48dd6f.png

    请求流程

    浏览器在第一次请求后缓存资源,再次请求时,会进行下面两个步骤:

    1. 浏览器会获取该缓存资源的 header 中的信息,根据 response header 中的 expires 和 cache-control 来判断是否命中强缓存,如果命中则直接从缓存中获取资源。
    2. 如果没有命中强缓存,浏览器就会发送请求到服务器,这次请求会带上 IF-Modified-Since 或者 IF-None-Match, 它们的值分别是第一次请求返回 Last-Modified 或者 Etag,由服务器来对比这一对字段来判断是否命中。如果命中,则服务器返回 304 状态码,并且不会返回资源内容,浏览器会直接从缓存获取;否则服务器最终会返回资源的实际内容,并更新 header 中的相关缓存字段。

    借用网上的一张图片

    e6fd22d5bbdc14eea049bfa417b982a8.png

    强缓存

    强缓存是根据返回头中的 Expires 或者 Cache-Control 两个字段来控制的,都是表示资源的缓存有效时间。

    • Expires 是 http 1.0 的规范,值是一个GMT 格式的时间点字符串,比如 Expires:Mon,18 Oct 2066 23:59:59 GMT 。这个时间点代表资源失效的时间,如果当前的时间戳在这个时间之前,则判定命中缓存。有一个缺点是,失效时间是一个绝对时间,如果服务器时间与客户端时间偏差较大时,就会导致缓存混乱。而服务器的时间跟用户的实际时间是不一样是很正常的,所以 Expires 在实际使用中会带来一些麻烦。
    • Cache-Control 这个字段是 http 1.1 的规范,一般常用该字段的 max-age 值来进行判断,它是一个相对时间,比如 .Cache-Control:max-age=3600 代表资源的有效期是 3600 秒。并且返回头中的 Date 表示消息发送的时间,表示当前资源在 Date ~ Date +3600s 这段时间里都是有效的。不过我在实际使用中常常遇到设置了 max-age 之后,在 max-age 时间内重新访问资源却会返回 304 not modified ,这是由于服务器的时间与本地的时间不同造成的。当然 Cache-Control 还有其他几个值可以设置, 不过相对来说都很少用了:no-cache 不使用本地缓存。需要使用协商缓存。no-store直接禁止浏览器缓存数据,每次请求资源都会向服务器要完整的资源, 类似于 network 中的 disabled cache。public 可以被所有用户缓存,包括终端用户和 cdn 等中间件代理服务器。private 只能被终端用户的浏览器缓存。

    如果 Cache-Control 与 Expires 同时存在的话, Cache-Control 的优先级高于 Expires 。

    协商缓存

    协商缓存是由服务器来确定缓存资源是否可用。 主要涉及到两对属性字段,都是成对出现的,即第一次请求的响应头带上某个字, Last-Modified 或者 Etag,则后续请求则会带上对应的请求字段 If-Modified-Since或者 If-None-Match,若响应头没有 Last-Modified 或者 Etag 字段,则请求头也不会有对应的字段。

    • Last-Modified/If-Modified-Since 二者的值都是GMT格式的时间字符串, Last-Modified 标记最后文件修改时间, 下一次请求时,请求头中会带上 If-Modified-Since 值就是 Last-Modified 告诉服务器我本地缓存的文件最后修改的时间,在服务器上根据文件的最后修改时间判断资源是否有变化, 如果文件没有变更则返回 304 Not Modified ,请求不会返回资源内容,浏览器直接使用本地缓存。当服务器返回 304 Not Modified 的响应时,response header 中不会再添加的 Last-Modified 去试图更新本地缓存的 Last-Modified, 因为既然资源没有变化,那么 Last-Modified 也就不会改变;如果资源有变化,就正常返回返回资源内容,新的 Last-Modified 会在 response header 返回,并在下次请求之前更新本地缓存的 Last-Modified,下次请求时,If-Modified-Since会启用更新后的 Last-Modified。
    • Etag/If-None-Match, 值都是由服务器为每一个资源生成的唯一标识串,只要资源有变化就这个值就会改变。服务器根据文件本身算出一个哈希值并通过 ETag字段返回给浏览器,接收到 If-None-Match 字段以后,服务器通过比较两者是否一致来判定文件内容是否被改变。与 Last-Modified 不一样的是,当服务器返回 304 Not Modified 的响应时,由于在服务器上ETag 重新计算过,response header中还会把这个 ETag 返回,即使这个 ETag 跟之前的没有变化。

    HTTP中并没有指定如何生成 ETag,可以由开发者自行生成,哈希是比较理想的选择。

    为什么要有 Etag

    HTTP1.1 中 Etag 的出现主要是为了解决几个 Last-Modified 比较难解决的问题:

    • 一些文件也许会周期性的更改,但是内容并不改变(仅仅改变的修改时间),这个时候我们并不希望客户端认为这个文件被修改了,而重新GET;
    • 某些文件修改非常频繁,比如在秒以下的时间内进行修改,(比方说1s内修改了N次),If-Modified-Since 能检查到的粒度是秒级的,使用 Etag 就能够保证这种需求下客户端在1秒内能刷新 N 次 cache。
    • 某些服务器不能精确的得到文件的最后修改时间。

    优先级

    Cache-Control > expires > Etag > Last-Modified

    用户行为对缓存的影响

    经过对qq、fire fox 、safari 、chrome 这几个浏览器的访问同一个页面测试我发现,不同的浏览器在 F5 刷新的时候 ,同一个文件 qq 、fire fox 浏览器会返回 304 Not Nodified,在请求头中不携带 Expires/Cache-Control; 而 chrome 和 safari 刷新的时候,会返回 200 from cache, 没有真正发起请求,走强缓存。可见不同的浏览器反馈是不一致的,所以下面表格中"F5刷新"时 Expires/Cache-Control 会无效我认为是存在一定争议的。

    而 Ctrl + F5 强制刷新的时候,会暂时禁用强缓存和协商缓存。

    e53281e7d9407c9792cad5375d9556b6.png

    如何设置强缓存和协商缓存

    1. 后端服务器,写入代码逻辑中:res.setHeader('max-age': '3600 public') res.setHeader(etag: '5c20abbd-e2e8') res.setHeader('last-modified': Mon, 24 Dec 2018 09:49:49 GMT)
    2. Nginx 配置add_header Cache-Control "max-age=3600" 一般来说,通过 nginx 静态资源服务器,会默认给资源带上强缓存、协商缓存的 header 字段。
    0c71249ebf91cc058fd36e127dcdbcba.png

    两个示例

    1. 如果在 cache-control 定义的 max-age 时间之内,js, css 文件会走强缓存,http 状态码是 200, 跟服务器也并不会有交互。但是第一个文件 index.html 文件, 每次回车或者刷新都是状态码都是 304 ,因为它的请求头中默认每次都携带了 Cache-Control: max-age=0 。
    33c1b8363b2f1b86d2a11845179a00bc.png
    a32d339d083f87ce32cbac454a6d6d32.png
    1. js css 文件 cache-control 超时之后,重新按回车会走协商缓存,请求服务器发现资源没有改变,于是返回 304 ,浏览器从缓存中获取内容,从 size 中也可以看出端倪, 几百 B 的包不是静态资源的体积。
    cc28885d542bf6cf5334e51621b2989f.png

    三级缓存原理(大白话)

    最后总结一下浏览器的三级缓存原理:

    1. 先去内存看,如果有,直接加载
    2. 如果内存没有,择取硬盘获取,如果有直接加载
    3. 如果硬盘也没有,那么就进行网络请求
    4. 加载到的资源缓存到硬盘和内存

    原文:https://github.com/frontend9/fe9-interview/issues/29

    展开全文
  • 浏览器缓存浏览器缓存是浏览器在本地磁盘对用户最近请求过的文档进行存储,当...那么浏览器缓存的过程究竟是怎么样的呢?在浏览器第一次发起请求时,本地无缓存,向web服务器发送请求,服务器起端响应请求,浏览器端...
  • 强缓存和协商缓存

    2021-03-24 11:35:50
    1、一个问题引出强缓存和协商缓存 1.1 问题背景 页面上一个离线工具下载: 离线工具下载到本地名称是服务端在响应头content-disposition中定义,规则是edge地址+端口; 单机版修改完edge端口(下载链接...
  • 浏览器缓存静态资源本质是HTTP协议缓存策略,其中分为强缓存和协商缓存,两种缓存都可以将静态资源缓存到本地,强制缓存是根据过期时间来决定是用本地缓存还是请求新资源;协商缓存每次都要经过服务器对比后决定...
  • 浅谈强缓存协商缓存 最近面试被问到很多次关于http缓存的问题,在此做下笔记以此记录。话不多说,先来看张图来直观感受下http缓存的整体流程。 强缓存 当浏览器向服务器请求资源时,首先检查有无缓存。这个...
  • 1.背景介绍做前端有两个比较令人头痛的事,一个是命名,另一个就是缓存了。...2.知识剖析什么是浏览器缓存浏览器缓存(Brower Caching)是浏览器在本地磁盘...浏览器是如何判断是否使用缓存的浏览器缓存的优点有:1.减少...
  • 1、强缓存(本地缓存) 1.1. 概念 直接使用本地缓存,不用跟服务器进行通信 1.2. 相关header字段 expires 一个未来时间,代表请求有效期,没有过期之前都使用当前请求。 cache-control no-cache:不使用本地...
  • 有经验同学可以直接去看第...强缓存和协商缓存1、基本原理1)浏览器在加载资源时,根据请求头expires和cache-control判断是否命中强缓存,是则直接从缓存读取资源,不会发请求到服务器。2)如果没有命中强缓存,浏...
  • 理解:如图所示,如果有缓存且没有过期那就直接从缓存中读取,返回状态码200(强缓存)。如果缓存没有已经过期了,那就判断是否有Etag,有话那就发送请求到服务器比对是否一致,如果一致那就从缓存中读取,
  • 缓存可以分为强缓存和协商缓存两种。 强缓存 在使用强缓存时,浏览器会根据首部参数如max-age,来判断该缓存是否已过期,如果没有过期,则直接使用该缓存,否则,请求服务器上资源。 主要首部字段有:Cache-...
  • 通常浏览器缓存策略分为两种:强缓存和协商缓存。基本原理浏览器在加载资源时候,会先根据这个资源一些http header判断他是否命中强缓存,强缓存如果命中,浏览器直接从自己缓存中读取资源,不会发请求到...
  • 掌握好缓存的原理并合理地使用无论对前端还是运维都是相当重要的。 什么是浏览器缓存 浏览器缓存(http 缓存) 是指浏览器在本地磁盘对用户最近请求过的文档进行存储,当访问者再次访问同一页面时,浏览器就可以直接...
  • 可以根据后面的一些详细介绍做一个系统理解浏览器缓存主要分为强缓存(本地缓存)和协商缓存(弱缓存)如上图,在浏览器第一次发送请求后,需要再次发送请求时,浏览器会首先获取该资源缓存的header信息,然后根据...
  • 内容来源:知了堂前端项目经理——蛋糕。小伙计们,我是蛋糕哥...今天是「2020年8月7日」,今天是分享「第27天」。非常考基础一个题!面试题解答限时一般是5-10...成熟)【今日面试题】什么是浏览器缓存(知道...
  • 当用户在浏览器中输入url后,浏览器首先会查看缓存中是否有相应资源,若有则需要判断缓存的资源是否过期,主要通过cache-controlexpires字段来判断,若没有过期则直接使用该资源,该过程就是强缓存;若资源过期了...
  • 强缓存和协商缓存在介绍缓存的时候,我们习惯将缓存分为强缓存和协商缓存两种。两者的主要区别是使用本地缓存的时候,是否需要向服务器验证本地缓存是否依旧有效。顾名思义,协商缓存,就是需要和服务器进行协商,...
  • http强缓存协商缓存

    2021-02-20 13:28:49
    若未命中则发送http请求,看是否命中强缓存,若命中则不返回资源,使用本地资源,此时相应状态码为304 若未命中强缓存则返回资源,此时相应状态码为200 强缓存: expire:GMT格式 (过期日期) http1.0 cache...
  • 浏览器缓存是性能优化非常重要的一个方案,合理地使用缓存可以提高用户体验,还能节省服务器的开销。掌握好缓存的原理并合理地使用无论对前端还是运维都是相当重要的。什么是浏览器缓存浏览器缓存(h...
  • 什么是浏览器缓存浏览器缓存(Brower Caching)是浏览器在本地磁盘对用户最近请求过文档进行存储,当访问者再次...更好用户体验浏览器缓存类型浏览器缓存主要有两类:缓存协商彻底缓存,也有称之为协商缓存和强...
  • 浏览器缓存(Brower Caching)是浏览器对之前请求过文件进行缓存,以便下一次访问时重复使用,节省带宽,提高访问速度,降低 服务器 压力http缓存机制主要在http响应头中设定,响应头中相关字段为Expires、Cache-...

空空如也

空空如也

1 2 3 4 5 ... 8
收藏数 152
精华内容 60
关键字:

强缓存和协商缓存的使用