一、查看浏览器缓存 查看浏览器缓存需要下载一个工具ChromeCacheView： http://www.nirsoft.net/utils/chrome_cache_view.html 二、缓存控制...HTTP/1.1定义的Cache-Control用来区分对缓存机制的支持情况，请求头和响应头均可以使用该字段。...该字段有很多指令和参数，参见： https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control#Directives 2.1...三、不使用缓存示例 const http = require("http"); const fs = require("fs"); http.createServer(function(req,res...否则，读取实体资源返回 八、最后 HTTP/1.1 请求首部和响应首部字段对大小写不敏感，通常服务端设置响应头采用首字符大写的方式，但读取的请求头则全为小写。
因此，缓存和重用以前获取的资源的能力成为优化性能很关键的一个方面。 序 本文用于解决以下六个疑问。 与缓存相关的HTTP首部字段主要有哪些？ 这些HTTP首部字段之间的联系与区别？...HTTP缓存首部字段的优先级？ HTTP缓存首部字段的特点与局限性？ 用户不同的页面刷新行为的差别？ 在实践中我们该用哪些报文头来控制缓存呢？ 文中使用的1.html以及doge.png如下所示 ?...我们可以看到该操作返回了200，并刷新了相关的缓存控制时间。 ?...缓存实践 综上对各种HTTP缓存控制头部的对比以及用户可能出现的浏览器刷新行为的讨论，当我们在一个项目上做http缓存的应用时，我们实际上还是会把上述提及的大多数首部字段均使用上。...而在用户的不同刷新页面行为中，二者的结合也能很好的利用HTTP缓存控制特性，无论是在地址栏输入URI然后输入回车进行访问，还是点击刷新按钮，浏览器都能充分利用缓存内容，避免进行不必要的请求与数据传输。
HTTP缓存首部字段的优先级？ HTTP缓存首部字段的特点与局限性？ 用户不同的页面刷新行为的差别？ 在实践中我们该用哪些报文头来控制缓存呢？...DOCTYPE html> 缓存控制测试 <...我们可以看到该操作返回了200，并刷新了相关的缓存控制时间。 ?...缓存实践 综上对各种HTTP缓存控制头部的对比以及用户可能出现的浏览器刷新行为的讨论，当我们在一个项目上做http缓存的应用时，我们实际上还是会把上述提及的大多数首部字段均使用上。...而在用户的不同刷新页面行为中，二者的结合也能很好的利用HTTP缓存控制特性，无论是在地址栏输入URI然后输入回车进行访问，还是点击刷新按钮，浏览器都能充分利用缓存内容，避免进行不必要的请求与数据传输。
HTTP缓存首部字段的优先级？ HTTP缓存首部字段的特点与局限性？ 用户不同的页面刷新行为的差别？ 在实践中我们该用哪些报文头来控制缓存呢？...DOCTYPE html> 缓存控制测试 <...我们可以看到该操作返回了200，并刷新了相关的缓存控制时间。...Cache-Control: no-cache Pragma: no-cache 4、综上 缓存实践 综上对各种HTTP缓存控制头部的对比以及用户可能出现的浏览器刷新行为的讨论，当我们在一个项目上做http...而在用户的不同刷新页面行为中，二者的结合也能很好的利用HTTP缓存控制特性，无论是在地址栏输入URI然后输入回车进行访问，还是点击刷新按钮，浏览器都能充分利用缓存内容，避免进行不必要的请求与数据传输。
HTTP缓存首部字段的优先级？ HTTP缓存首部字段的特点与局限性？ 用户不同的页面刷新行为的差别？ 在实践中我们该用哪些报文头来控制缓存呢？ 文中使用的1.html以及doge.png如下所示 缓存控制测试 <...我们可以看到该操作返回了200，并刷新了相关的缓存控制时间。 ?...Cache-Control: no-cache Pragma: no-cache 缓存实践 综上对各种HTTP缓存控制头部的对比以及用户可能出现的浏览器刷新行为的讨论，当我们在一个项目上做http缓存的应用时...而在用户的不同刷新页面行为中，二者的结合也能很好的利用HTTP缓存控制特性，无论是在地址栏输入URI然后输入回车进行访问，还是点击刷新按钮，浏览器都能充分利用缓存内容，避免进行不必要的请求与数据传输。
客户端检查资源超过有效期、强缓存命中失败的情况下，则发出请求“询问”服务器是否资源真的过期了，询问的同时在请求头要携带着资源的「上次更新时间」或者「唯一实体标识」（不同http版本导致的共存问题）。...《图解HTTP》 协商缓存 特点： 服务端校验 304 Not Modified状态码 Last-Modified Etag 304（Not Modified） 该状态码虽然是3XX的类别，但是跟301...也就是说，如果命中协商缓存，服务端响应请求时，只会返回一个304状态码、并没有实际上的文件内容，因此在响应体体积上的节省是协商缓存的优化点 HTTP/1.0 Last-Modified组 Last-Modified...他的格式如： if-modified-since: Thu, 01 Jan 1970 00:00:00 GMT HTTP/1.1 Etag组 Etag （资源的匹配信息） 响应首部字段，缓存的一种强校验器...（注意：实际HTTP1.1的请求中，两组字段同时包含在请求及响应头中，我这里为了加深组CP的印象，分开阐述） 1、Last-Modified组整体流程如下： 服务器通过 Last-Modified 字段告知客户端
浏览器缓存控制机制 浏览器缓存控制机制有三种：HTML5离线存储和本地缓存、HTML Meta 标签、HTTP 协议缓存。...HTTP 协议缓存 HTTP 协议缓存是我们本文讲解的重点，它是通过 HTTP 头信息来控制缓存的，HTTP 头信息可以让你对浏览器和代理服务器如何处理你的副本进行更多的控制。...一般而言，需要认证 HTTP 请求内容会自动私有化（不会被缓存）。 privateN： 允许缓存专门为某一个用户存储响应，比方说在浏览器中；共享缓存一般不会，例如在代理中。...若最后修改时间较新，说明资源有被改动过，则响应资源内容（写在响应消息包体内），HTTP 200；若最后修改时间较旧，说明资源无新修改，则响应 HTTP 304 (无需包体，节省流量)，告知浏览器继续使用缓存...创建支持缓存网站的小技巧 通过上面的介绍，我们知道 HTTP 协议缓存的机制，目的就是让你可以更灵活更细致的控制浏览器缓存，从而让你的网站的缓存更加友好，用户体验更完美。
今天自己学习了一些关于前端缓存的东西，不一定有什么特别的用，仅让自己知道缓存，说不定哪天就用上了。 前端分为HTTP缓存和浏览器缓存。...HTTP缓存几乎没用过，也不知道有没有不经意间使用了，因为HTTP缓存主要是服务器代码上设置的。 HTTP第一次请求之后，服务器会在返回的头部传回缓存的参数。...然后第二次请求的时候浏览器判断这些参数是什么缓存类型，相应的返回。 HTTP缓存有强缓存和协商缓存（也有人叫对比缓存）。...说了这么多，HTTP缓存跟前端有什么关系？确实，大部分HTTP缓存是由服务器完成，关于前端怎么操作的没查到相关的文档，只知道可以通过meta标签禁用缓存和动态设置header。...缓存对于前端的性能优化算是很大的，推荐使用强缓存，然后用hash值的方法消除强缓存的影响。 如果有人知道前端怎么去操作HTTP缓存，希望可以指教一下。 （完）
一、http协议实现缓存 1....缓存头部 通用缓存、条件缓存、缓存控制三大类 头部名称 说明 请求/响应 通用缓存头部 控制客户端是否向服务器发送请求或者是服务端响应请求 cache-control 用于随报文传递的缓存提示 pragma...no-transform：传送没有被转换过的实体数据（如：压缩），不知如何验证 only-if-cached：客户端获取缓存（若有），不用向服务器请求， 无缓存则原始请求 cache-extension...），不知如何验证 only-if-cached：客户端获取缓存（若有），不用向服务器请求， 无缓存则原始请求 must-revalidate：当前资源一定是向原服务器发出验证请求的，若请求失败返回504...，完全按钮响应的max-age来控制缓存了，firefox是按照http规范实现的。
" ":" HTTP-date 一个精确的时间点，在此之前，缓存有效。...| "min-fresh" "=" delta-seconds ; 客户端不接受经过转换的内容，例如Content-Type | "no-transform" ; 客户端只想要已缓存的资源...，否则返回新资源 Age 响应头字段，表示资源在代理服务器上已缓存的时间 Age = "Age" ":" age-value age-value = delta-seconds 计算方式为： /* *...= Date - Last-Modified / 10 默认的缓存策略，就叫启发式缓存，启发式是说基于经验构造的，没有严格的依据 五.刷新行为 浏览器有3种不同的刷新行为，在验证HTTP缓存时很容易被迷惑.../1.1：RFC 2616 浏览器缓存机制剖析：缓存机制流程图不错，Header字段含义描述不正确 HTTP缓存控制小结：内容很准确，且较全面 Increasing Application Performance
可以与Last-Modified服务器响应首部配合使用，只有在内容被修改后与已缓存版本有所不同时才去获取内容。...如果已缓存标签与服务器文档中的标签有所不同，就会执行请求的方法。 如果服务器发送了一个实体标签，HTTP/1.1客户端就必须使用实体标签验证器。...）； （4）新鲜度检测—缓存查看已缓存副本是否足够新鲜，如果不是，就询问服务器是否有任何更新条件Get请求； （5）创建响应—缓存会用新的首部和已缓存的主体来构建一条响应报文； （6）发送—...控制缓存的能力 服务器可以通过HTTP定义的几种方式来指定在文档过期之前可以将其缓存多长时间。...注意：HTML2.0定义了来标记非缓存，其并不是控制文档缓存特性的最好方法。
HTTP 缓存不是必须的，但重用缓存的资源通常是必要的。它可以减少服务器的压力，如果不使用缓存，每次发起请求都要求服务器发送相应数据，很多时候服务器发来的内容并没有发生变化，就会“浪费”服务器带宽。...可以在客户端设置缓存，给缓存加上过期时间，如果期限没到就是用本地缓存的内容。然而常见的 HTTP 缓存只能存储 GET 响应，对于其他类型的响应则无能为力。...缓存头部 HTTP 相关的缓存头部一般有： Cache-Control 通用的首部，它是缓存控制字段； Expires 响应首部，代表资源过期时间； Last-Modified 响应首部，表示资源的最新修改时间...no-cache 中如果包含 no-cache 指令，表示客户端可以缓存资源，每次使用缓存资源前都必须重新验证其有效性。这意味着每次都会发起 HTTP 请求。设置 max-age=0 的功能与之类似。...Pragma 它是 HTTP/1.0 的通用头，它用来向后兼容只支持 HTTP/1.0 协议的缓存服务器。
HTTP 缓存分为强缓存和协商缓存....HTTP 缓存控制机制 HTML Meta 标记 // 当前页面不缓存, 每次访问都去服务器拉取....HTTP 头信息 HTTP 头信息 强缓存 (200 from cache) 判断的字段: expire 或 cache-control expire [http 1.0 的标准], 存储的是过期的具体时间...HTTP Cache/Disk Cache (硬盘上的缓存) Push Cache 一般资源会存入内存. 如果内存不够, 会释放一些. 首次请求 ? 走网络请求 再次请求 (F5) ?...用户行为与浏览器缓存 F5 刷新, 内存不见, 协商缓存依然存在 强制刷新/控制台强制清除缓存 内存不见, 协商缓存也存在 地址栏访问, 回车, 前进后退. 缓存都不在.
所以HTTP请求都采用缓存的策略，避免重复请求服务器，增加服务器压力。...表述语言：Accept-Lauguage:zh-CN,zh Expires 在HTTP1.0中开始使用，表示一种资源过期的头部，描述的绝对时间是由服务器返回。...在 HTTP/1.1 中，会优先处理 max-age指令，它优先级高，但是在 HTTP/1.0 中，max-age 指令会被忽略掉，就处理Expires指令。...Cache-Control 是用来控制缓存的行为，在HTTP1.1中，通过Cache-Control通用首部字段来控制缓存 Cache-Control的请求中的值 max-age：出现在请求报文中，表示缓存资源的时间小于小于该...并且优先级高于max-age与Expires public：将资源作为公共缓存，多个用户使用，无论私有缓存还是共享缓存，都可以将该响应缓存，一般存放在代理服务器上 private：资源私有化，只能被单个用户使用
Cache 几乎无处不在，CPU 的 L1 L2 L3 Cache、iOS 系统的 clean page 和 dirty page 机制、HTTP 的 tag 机制等等，这些背后都是 Cache 设计思想的应用...上一篇介绍了关于 HTTP 的基础知识，本篇对 HTTP Cache 做一个完整的介绍。...HTTP 头信息控制缓存 分为两种 强制缓存 协商缓存 强制缓存如果命中缓存则不需要和服务器端发生交互，而协商缓存不管是否命中都要和服务器端发生交互，强制缓存的优先级高于协商缓存。...并且 Expires 是 HTTP/1.0 的标准，现在更倾向于用 HTTP/1.1 中定义的 Cache-Control。两个字段同时存在时也是 Cache-Control 的优先级更高。...: 表明响应只能被单个用户(可能是操作系统用户、浏览器用户)缓存，是非共享的，不能被代理服务器缓存 no-cache: 强制所有缓存了该响应的用户，在使用已缓存的数据前，发送带验证器的请求到服务器。
浏览器缓存 HTTP 缓存通常要配合客户端（浏览器）使用才能发挥效果，所以又被称之为浏览器缓存，是 Web 性能优化的一大利器。 缓存类型 浏览器缓存分为强缓存和协商缓存。...另外一种分类方式，可以将浏览器缓存分成 HTTP 协议缓存和非 HTTP 协议缓存。 (1) 非 HTTP 协议缓存：使用 HTML Meta 标签，开发者可以告诉浏览器是否缓存当前页面。...HTTP 缓存 HTTP/1.0 缓存字段 (1) Pragma：设置资源是否缓存，no-cache 表示不缓存。...若最后修改时间较新，说明资源又被改动过，则响应整片资源内容（写在响应消息包体内），HTTP 200；若最后修改时间较旧，说明资源无新修改，则响应HTTP 304 (无需包体，节省浏览)，告知浏览器继续使用所保存的...参考资料 HTTP Headers 浅谈浏览器http的缓存机制 Web缓存相关知识整理 浅谈Web缓存 详谈Web缓存
前端缓存 可分为两大类：http缓存和浏览器缓存。我们今天重点讲的是http缓存，所以关于浏览器缓存大家自行去查阅。...下面这张图是前端缓存的一个大致知识点： HTTP 缓存策略分为两种： 强缓存 和 协商缓存 ，这两种缓存策略都是服务端设置 HTTP Header 来实现的 （一）强缓存 强缓存的意思很简单，直接从浏览器缓存过的本地进行读取...，不会去请求服务器 s-maxage：这个和上面的一样，只不过这个设置的是代理服务器的缓存时间 privte：这个表示缓存只能被客户端的浏览器缓存，不能被代理服务器缓存 public：这个表示缓存既可以被浏览器缓存...，也可以被代理服务器缓存 no-store：这个属性表示不缓存，在任何情况下，都是与服务器进行最新的交互 no-cache：这个并非不缓存的意思，这个表示强制进行协商缓存，会在下面描述 （二）协商缓存...协商缓存表示在使用本地的缓存之前，会先向服务器发一个请求，与服务器协商当前浏览器的缓存是否已经过期了，如果没过期，那么就使用本地的资源，如果过期了就去请求最新资源。
虽然 HTTP 缓存不是必须的，但重用缓存的资源通常是必要的，HTTP 缓存是一个 web 性能优化的重要手段。 HTTP 缓存的类型 通常 HTTP 缓存策略分为两种： 强缓存 协商缓存。...强缓存 强缓存不会向服务器发送请求，直接从缓存中读取资源，在 chrome 控制台的 network 选项中可以看到该请求返回 200 的状态码，并且size显示from disk cache或from...HTTP 缓存控制 在 HTTP 中，我们可以通过设置响应头以及请求头来控制缓存策略。 强缓存可以通过设置Expires和Cache-Control 两种响应头实现。...会覆盖max-age和expires,私有缓存会忽略它 max-stale[=] 客户端愿意接收一个已经过期的资源，可以设置一个可选的秒数，表示响应不能已经过时超过该给定的时间。...总结 通过前文，我们了解到 HTTP 缓存主要分： 强制缓存 协商缓存。 强制缓存由 Cache-Control，Exipres（HTTP1.0）控制。
web缓存： 1.可以自动保存常见文档副本的HTTP设备，当web请求抵达缓存时，如果存在缓存副本，就直接从本地存储设备返回，而不是去源服务器获取 2.缓存命中和未命中 3.HTTP再验证，检测服务器上的内容是否发生了变化...缓存对副本进行再验证时，会向服务器发送一个小的再验证请求，如果没变化，服务器会返回304 Not Modified,get请求中添加if-modified-since会进行再验证 4.缓存命中率：由缓存提供服务的占比...，命中率与缓存大小，用户兴趣相似点，数据的变化，缓存配置等有关，40%的命中率是合理的，对降低整体时延很有好处 5.字节命中率：缓存提供的字节流量在传输流量中的占比，对节省带宽很有利 6.私有缓存，...比如web浏览器 7.共有代理缓存，实现层次化的多级缓存很有意义 8.网状缓存，内容路由，对等缓存；有些不是简单的层次结构而是构建复杂的网状关系缓存，这些代理缓存也可以称为内容路由器，ICP和HTCP...协议扩展了HTTP的对等缓存兄弟缓存 9.缓存处理步骤：接收请求=>解析请求=>查询本地副本(获取源服务器)=>新鲜度检测=>创建响应=>发送响应=>记录日志 10.文档过期：服务器返回头信息Cache-Control
领取专属 10元无门槛券
手把手带您无忧上云
