浏览器第一次加载资源时，返回值一般为200，表示已成功获取资源，浏览器缓存中会记录max-age。第二次访问时：如果只是用浏览器打开浏览器，浏览器会判断资源是否在缓存中。如果是，它会判断max-age看是否已经过期。如果还没有过期，就直接读取缓存，根本不和服务器交互。也就是说，即使断网也能开启，就像在本地运行一样！如果已经过期，就去服务器请求，等待服务器响应。这是非常耗时的。如果服务器发现资源没有变化，就会返回304，告诉浏览器我没有变化。您可以读取缓存，所以浏览器不需要从服务器拉取数据。但是，等待服务器响应也是一个很严重的问题。在网速飞快的今天，等待响应有时比下载还慢。如果是用浏览器刷新，那么浏览器不会判断max-age，直接去服务器端获取。如果服务端判断资源没有变化，还是会返回304，和上面一样，所以刷新一下，其实很吓人，就像把所有的资源都发给服务端去请求，问服务端我有没有已过期。当浏览器第一次请求资源时，可以在服务器的响应头中设置expires字段。该字段表示资??源的缓存过期时间。当浏览器第二次请求时，如果时间还在缓存时间内，则直接使用缓存，否则重新加载资源。expires字段有一个缺陷，就是必须在服务端和客户端严格同步才能生效，所以现在很多人不会用修改后的方案。另一种方案是，第一次请求资源时，服务端设置响应头cache-control:max-age，意思是告诉浏览器资源什么时候过期，第二次请求资源的时候，判断是否超过过期时间，如果没有，直接使用缓存。缓存状态码200OK(fromcache)和304NotModified200OK(fromcache)表示浏览器没有和服务器确认过，直接使用浏览器缓存；304NotModified表示浏览器和服务器再次确认了缓存的有效性。缓存以供重用。304NotModified：客户端已缓冲文件并发出条件请求（通常通过提供If-Modified-Since标头来表明客户端只想从指定日期更新文档）。服务器告诉客户端可以继续使用原来的缓冲文档。304NotModified比200OK(fromcache)慢，这意味着浏览器在使用缓存200和304特征状态码之前也向服务器确认“If-Not-Modified”200：请求已成功，并且request预期的响应头或数据体将与此响应一起返回。即返回的数据是全量数据。如果文件没有被GZIP压缩，文件的大小取决于传输量。状态码304：如果客户端发送一个有条件的GET请求并且请求被允许，但是文档的内容（自上次访问以来或者根据请求的条件）没有改变，服务器应该返回这个状态码。也就是说，客户端和服务器只需要传输少量数据来验证文件。如果文件没有被修改，则不需要返回全量数据。状态为304的请求比状态为200的请求小很多，因为304只需要返回响应头，而不是整个文件，所以只需要几个字节，可以节省大量的网络带宽，并减少页面的渲染时间。什么是浏览器缓存？浏览器缓存是为了节省网络资源，加??快浏览速度。浏览器将最近请求的文档存储在用户的磁盘上。当访问者再次请求该页面时，浏览器可以显示本地磁盘中的文档，可以加快页面浏览速度。浏览器缓存主要包括强缓存和协商缓存。--百度百科浏览器缓存也叫http缓存。通俗地说，浏览器缓存是指浏览器为了节省网络资源和加快页面渲染，将请求的资源缓存在本地（硬盘和内存），然后根据HTTP判断是否读取本地缓存资源响应头。.缓存HTTP头信息Date：原始服务器发送资源响应报文的时间（GMT格式）Age：Age表示本次响应存活了多长时间（HTTP/1.0响应没有Age）Expires：表示HTTP中的具体时间header过期时间(HTTP/1.0),Expires=HTTP-datePragma:no-cache,每次请求页面不读取缓存，兼容HTTP/1.0，优先级高于Expires(HTTP/1.0+HTTP/1.1）缓存控制：优先级高于Pragma，Expires（HTTP/1.1）【public，客户端和服务端都可以缓存；private，只有客户端可以缓存；no-store，不使用缓存；无缓存，使用协商缓存。】ExpiresExpires是http1.0提出的表示资源过期时间的header。它描述了一个绝对时间并由服务器返回。第二次请求Expires时，会与本地时间进行比较。Expires第一次请求服务器时，响应头会返回一个Expires文件过期时间。Expires对于第二次请求，客户端使用本地时间与文件的过期时间进行比较。如果文件没有过期，则直接使用本地缓存，并返回状态码200（来自内存缓存）或200（来自磁盘缓存）。ExpiresCache-ControlCache-Control:no-cache必须先和代理服务器确认是否改变，再决定是使用缓存还是请求，类似于协商缓存(304)Cache-Control:no-storeis真正的非缓存数据到本地Cache-Control:public可以被所有用户缓存（多用户共享），包括终端和CDNs等中间代理服务器Cache-Control:private只能被终端浏览器缓存（和是私有缓存），不允许中继缓存服务器缓存Cache-Control:must-revalidate如果缓存的内容无效，必须向服务器发送请求验证Cache-Control:max-age=s缓存的内容content在s秒后过期，只有HTTP1.1可用max-gae第一次请求时，服务器运行时，响应头会返回一个max-age，也就是文件在多长时间后过期。对于max-gae的第二次请求，客户端会检查文件是否过期。如果文件没有过期，则直接使用本地缓存，返回状态码200（来自内存缓存）或200（来自磁盘缓存）。Strongcache(200fromdiskcacheor200frommemorycache,harddiskcacheandmemorycache)强缓存是指浏览器对请求的资源进行缓存，并根据缓存标识（响应头的缓存控制：max-age和expires)确定资源没有过期。Negotiationcache(304)Negotiationcache是??指浏览器缓存请求的资源，但无法判断资源是否过期。它需要向带有缓存标识符（响应头的last-modified和Etag）的服务器发起请求，询问资源是否过期。.Browsercache-relatedresponseheaderstrongcache-relatedExpiresExpires是HTTP/1.0中控制浏览器缓存的一个字段，它的值是服务器返回的请求结果缓存的过期时间。当浏览器再次发起请求时，如果客户端时间早于过期时间，则直接读取缓存的结果，而不会重新发起请求。因为这里使用客户端的时间进行判断，可能会因为客户端的时间和服务端的时间不一致而导致意想不到的缓存行为。Cache-Controlcache-control是HTTP/1.1的一个字段，是控制缓存的重要规则。该值包含几组可选值，以逗号分隔，控制代理服务器缓存tocacheno-cache：客户端缓存内容，是否使用缓存需要和服务端协商no-store：所有内容都不会缓存(seconds)，表示缓存会在xx秒后失效当max-age和expires同时存在时，只有max-age有效，expires不再生效。negotiationcacherelatedlast-modifiedlast-modified用于标识资源的最新修改时间，用于标记内容是否更新。响应头的last-modified将作为缓存标识符与缓存一起存储。当请求需要再次与服务器协商时，请求头的if-Modified-Since字段会携带缓存中last-modified的值和服务器的资源修改。比较时间以确定缓存是否已过期。使用last-modified时，有可能服务器资源实质上没有更新但是修改时间更新了，比如资源重写。EtagEtag是服务器根据资源内容通过一系列算法计算出来的用于标识资源的字符串代码。当资源内容被修改时，相应的Etag也会更新。它的主要作用是标记资源内容是否更新。同理，响应头的Etag也会作为缓存标识一起存入缓存。当请求需要再次与服务器协商时，请求头的if-None-Match字段会携带缓存中的etag值和服务器上资源的Etag。比较判断缓存是否过期。当Etag和last-modified同时出现时，以Etag的标识为准。浏览器缓存相关的请求头Cache-Controlno-cache：强制向源服务器重新认证，控制代理服务器不能直接返回缓存max-age：响应的最大年龄值，可以设置max-age=0使用协商的缓存last-modified-since和last-modified使用if-None-Match配置Etag使用完整的浏览器缓存过程判断是否有本地缓存??，如果没有本地缓存??资源，去到第4步，如果有则转第2步。使用expires和max-age判断缓存是否过期，没有则直接返回资源（200从缓存中取出）。否则转步骤3，携带缓存标识(if-modified-sinceif-None-Match)请求，与服务器协商验证缓存是否过期，否则返回无资源实体的响应，以及浏览器从缓存中获取资源返回给前端（304），否则转4。4、正常请求资源，服务器返回资源（200）并缓存。缓存相关知识点缓存位置浏览器缓存的存储位置分为磁盘缓存和内存缓存，浏览器的读取顺序为内存->硬盘。不同的资源可能缓存在不同的位置css：因为解析构建CSSOM树后不需要css，所以会缓存在硬盘中，读取时从硬盘读取。JS和图片：浏览器解析完JS和图片后会放到内存中，所以先读取内存（实践证明没有必要），打开新窗口或浏览器时读取硬盘缓存.不同用户行为导致的缓存问题Refresh(F5/Command+r)刷新时会在文档请求头添加Cache-Control:max-age=0，所以文档一般会触发协商缓存。正常请求文档以外的其他资源（JScss）（可能会触发强缓存或协商缓存）。强制刷新(CTRL+F5/Command+shift+r/checkdisablecache)强制刷新时会在请求头添加Cache-control:no-cache，使用协商缓存，但同时删除协商缓存字段(if-modified-sinceif-none-match)，所以最终的结果是向服务器请求新的资源。关闭浏览器/打开新选项卡没有特殊操作，可以使用强缓存或协商缓存。
