缓存的基本流程其中：缓存是否过期参考Cache-Control，Expires缓存是否有效参考Last-修改后，从进程的Etag中我们可以发现性能最好的应该是200fromcache。这种资源直接从本地返回。没有网络请求后，就是304NotModified。更改状态码后没有资源实体。只有header告诉浏览器文件指纹仍然有效，可以继续使用，同时带回Expires、Etag等信息供客户端更新使用。效率最低的是200，由于缓存没有缓存或者缓存过期，浏览器返回对应的资源实体供浏览器使用。总结一下：我们可以把resourcerequest改为200fromcache来提高性能。当资源发生变化时，可以通过更改文件名的方式重新获取。现在很多打包框架都支持这种方式，比如gulp、webpack、fis3等几个缓存相关的HTTP属性Cache-ControlExpiresLast-ModifiedETagCache-ControlHTTP1。1实施。用于控制本地缓存文件的有效时长。有如下属性值：public：所有内容都会被缓存（客户端和代理服务器都可以缓存）private：内容只缓存在私有缓存中（只能缓存客户端，代理服务器不能缓存）no-cache:必须首先被缓存检查返回的响应是否已经被更改，然后才能用于满足对同一URL的后续请求。因此，如果存在合适的验证令牌(ETag)，则no-cache会发起一次往返以验证缓存的响应，从而避免在资源未更改的情况下进行下载。no-store：所有内容都不会缓存在缓存或临时互联网文件中must-revalidation/proxy-revalidation：如果缓存的内容失效，则必须将请求发送到服务器/代理进行重新验证max-age=xxx（xxx是anumber):缓存的内容将在xxx秒后过期，该选项仅在HTTP1.1中可用，如果与Last-Modified一起使用，优先级更高ExpiresHTTP1.0属性，用于指定文件的过期事件，是一个绝对时间点。由于服务器事件和客户端事件之间可能存在不一致，因此在HTTP1.1中将max-age属性添加到Cache-Control中。Last-ModifiedLast-Modified是标识文件在服务器上的最新更新时间。下次再次获取时，如果缓存过期，请求头会带上If-Modified-Since字段给服务器，服务器会把这个字段和文件的更新事件进行比较。一致则返回304，不一致则使用对应的文件作为响应返回的ETagEtag由服务端生成，客户端通过条件判断请求来验证资源是否被修改如果匹配或如果不匹配。通常使用If-None-Match。参考：https://blog.csdn.net/lydia88...用户点击刷新：浏览器发送Cache-Control:max-age=0给浏览器手动刷新页面（F5），浏览器会直接认为缓存已经过期（可能缓存还没有过期），在请求中添加一个字段：Cache-Control:max-age=0，并向服务器发送一个数据包，检查是否有文件更新。强行刷新页面（Ctrl+F5），浏览器会直接忽略本地缓存（如果有缓存也会认为没有本地缓存??），并在请求中添加一个字段：Cache-Control:no-cache(orPragma:no-cache)，发送一个包从服务中重新拉取文件。服务器配置（nginx）在默认的nginx配置下（去掉Etag），第一次访问页面时，返回200OK，请求的Cache-Control为max-age=0，返回的Last-Modified是对应文件的Lastmodifieddate。对应的content-length为10027，点击刷新后，发送请求时，包含If-Modified-Since字段。服务器将If-Modified-Since的值与文件的最后修改日期进行比较。它们是相同的，所以返回304Not。Modified请求的大小是158B，很小，但是如果你连请求都不需要，直接200from-cachenginx配置expireslocation/{expiresmax;标签关闭；根HTML；indexindex.htmlindex.htm;}重启nginxnginx-sreload第一次请求的Response头中的Cache-Control变为max-age=315360000，Expires变为2037，第二次请求（浏览器打开新标签页请求）完成配置
