304状态码详解（协商缓存） 上一篇文章针对不同的状态码做了一个整理，还说到要专门针对304做一个详解，于是与，今晚又来学习了。 首先说一下背景： 我们知道前端代码打包后需要部署到静态服务器上。...2、cache-control字段：该字段有几个可选值包括no-cache、no-store、public、private等，这些值决定了能否使用缓存以及缓存的方式。...no-cache时，代表不使用本地缓存，客户端会向服务器发送请求，由服务器决定是否重新获取资源。...no-store时，会完整下载资源 public时：表示资源可以被所有用户缓存，包括服务器 private时表示资源只能被浏览器终端缓存 如果两者同时存在，cache-control优先级更高一些。...如果资源没更改，返回304，浏览器读取本地缓存。 如果资源有更改，返回200，返回最新的资源。
304 在嗅探抓包过程中，常见的有两种200和304。这两个状态码都关系到能否获取重要信息。...当客户第一次请求服务器资源，服务器成功返回资源，这时状态码为200；往往看到200就表示资源可访问 如果刷新还是 200 则表示没有经过网络请求；304代表与服务器通信了，然而资源没有发生改变就是304
上图是koa2的源码目录结构的lib文件夹，lib文件夹下放着四个koa2的核心文件：application.js、context.js、request.js、response.js。...use是收集中间件，将多个中间件放入一个缓存队列中，然后通过koa-compose这个插件进行递归组合调用这一些列的中间件。...let http = require('http'); let server = http.createServer((req, res) => { res.writeHead(200);.../application'); let app = new Koa(); app.use((req, res) => { res.writeHead(200); res.end('hello...模块二：构造request、response、context对象 阅读koa2的源码得知，其中context.js、request.js、response.js三个文件分别是request、response
index.js if-mofied-since:时间点（格林威治时间）==》服务器端 客户端《============过期应答200 index.js《================服务器端 客户端...《==========未过期应答304 index.js《================服务器端 大概意思是，每次都会请求到服务，由服务器根据客户端发来的if-mofied-since（就是首次请求服务器相应的...last-modified时间）时间，判断这个时间是判断是否协商缓存命中，如果缓存命中，服务器返回状态码304，内容为空即可，否则返回200，内容为最新的资源 res.setHeader('Cache...另一种协商缓存是根据内容判断，一般做法是将返回内容进行摘要（hash）,然后通过对比摘要来判断内容是否更新 客户端==========》初次发起请求inde.js==================...==========》服务器端 客户端《============过期应答200 index.js《================服务器端 客户端《==========未过期应答304 index.js
Windows/SysWOW64/config/systemprofile/AppData/Local/Microsoft/Windows/Temporary Internet Files这个文件夹，系统缓存目录里面小文件太多...，有几百万个，一双击文件夹，系统立马崩溃，试过重启系统，缓存仍然异常。...第一句是个notice告警级别很低可以忽略，第二个是致命错误，D:/web/www/include/general.inc.php第60行超时，于是打开代码定位第60行发现是C:/Windows/Temp缓存目录...，经验猜测估计是缓存目录小文件太多了，操作系统光遍历一遍这个目录都够累的了，而且IIS中有100多个站点。...要是服务器永远不重启不清理缓存，根据此种业务情况，Temp迟早有撑不住的一天。于是想办法清理C:/Windows/Temp，电脑管家清理了2个小时没有任何反应。
协商缓存策略 协商缓存是当强缓存没有命中的情况或者按下 F5 键刷新页面会触发，它每次都会携带标识与服务器进行校验，符合则返回 304 标识，表示资源没有更新，如果协商缓存也失效了，进入下一个阶段获取最新数据...就需要用到下面的协商缓存了。 三、协商缓存 如果强缓存未命中或用户按下 F5 强制刷新后进入协商缓存，服务器则根据浏览器请求时的标识进行判断，如果协商缓存生效返回 304 否则返回 200。...启动程序，浏览器执行 http://localhost:3010/ 打开页面，我多次调用发现第一次是从服务器拿的数据且状态为 200，之后每次都是 memory cache 为什么不是 304 呢？...现在我们要达到 304 的效果，不走强缓存直接走协商缓存，修改我们的响应，设置 Cache-Control=max-age=0 修改如下： response.writeHead(200, { '...相同点：校验通过返回 304 通知客户端使用本地缓存，校验不通过重新获取最新资源，设置 Last-Modified/Etag 响应头，返回状态码 200 。 疑问？ POST 可以缓存吗？
String.prototype.isInList = function(list) { 3 var re = eval("/["+list+"]/"); 4 return re.test(this); 5 } 二、系统中js
(js|css|html|png|jpg)$ { expires 3d; } 下面是 nginx 静态资源缓存 说明: expires 3d; // 表示缓存 3 天 expires 3h;...如果设置为 -1 在 js、css 等静态文件在没有修改的情况下返回的是 http 304. 如果修改返回 http 200 http 304：自从上次请求后，请求的网页未修改过。...http 200：服务器已成功处理了请求，这表示服务器提供了请求的内容。 如果不想让代理或浏览器缓存，加 no-cache 参数 location ~.*\....(js|css|html|png|jpg)$ { add_header Cache-Control no-cache; } 这样浏览器 F5 刷新时，nginx 静态资源缓存 设置返回的状态码就是...http 200，而不是 http 304
1、前端缓存概述 前端缓存主要是分为HTTP缓存和浏览器缓存。其中HTTP缓存是在HTTP请求传输时用到的缓存，主要在服务器代码上设置；而浏览器缓存则主要由前端开发在前端js上进行设置。...，看是否击中协商缓存，击中则返回304，否则服务器会返回新的资源。...HTTP缓存分为强缓存和协议缓存，它们的区别如下： 200 from disk or 200 from memory 强缓存的200也有两种情况：200 from disk和200 from memory...2.1.3 最佳优化策略——消灭304 最佳优化策略：因为协商缓存本身也有http请求的损耗，所以最佳优化策略是要尽可能的将静态文件存储为较长的时间，多利用强缓存而不是协商缓存，即消灭304。...Hash命名： http://xxx.com/main.5eas34fa.js http://xxx.com/main.js?
动态页面与静态页面区别 静态资源（css、js、images、html等）： 当用户多次访问这个资源，资源的源代码永远不会改变的资源。...解决办法：加上时间戳规范t = 项目上线 304走本地缓存状态码原理: 默认浏览器图片缓存是7天。...第一次下载资源的时候，客户端保存修改资源时间 第二次下载资源的时候，服务端判断客户端上一次修改的时间是否需返回200还是304 第二次下载资源的时候，服务端判断当前资源文件与客户端上一次修改的时间是否需返回...200还是304客户端第二次下载资源最后修改时间 2018/6/28 下午11:07:11 服务端最后一次修改时间大于客户端最后一次修改的时间200重 新加载资源 服务器端最后一次修改的时间小于客户端最后修改的时间返回...304走本地缓存
假如页面没有错误返回都是正确那么就是返回文件数据和Http Status为200 -OK的状态。 ? ...这样就提高了，浏览器的响应性能，因为文件都缓存到了客户端，并且通过304状态，服务端与浏览器的请求流量得以减少。 ...和304状态的请求；而且在这个例子里浏览器会自动缓存这些文件24小时，但是在此期间并不会返回404状态。 ...状态给浏览器，如果没有变化则返回304状态给浏览器端。 ...3.为静态文件提供版本号 通常我们都使用形如https://localhost/js/site.js?v=1 这样的地址来解决缓存的问题。
在文本最后面添加： #打开缓存 ExpiresActive on #css文件缓存7200000/3600/24=83天... ExpiresByType text/css A7200000 #js文件缓存83天 ExpiresByType application/x-javascript A7200000...（那就是如果不出现 200 form cache， 而是出现了304，那是因为，你刷新了浏览器。。。想要出现 200 form cache，需要在浏览器地址栏里按回车键。）...也就是说：刷新浏览器 触发 304， 地址栏回车触发 200 form cache。...查了好久才发现了，之前一直想不通，既然设置了cache-control和expire为啥还是304，这就是原因，就是这么简单。
到网上搜罗了一番资料后用 Node.js 实现该协议，倒也没有想象中那么复杂，除去注释语句和 console 语句后，大约 200 行代码左右。本文记录了实现过程中的经验和总结。...2、知识储备 如果要自己写一个 Websocket 服务，主要有两个难点： 熟练掌握 Websocket 的协议，这个需要多读现有的解读类文章；（下面会给出参考文章） 操作二进制数据流，在 Node.js...B、 实战 实现代码放在自己的 demos 仓库的 micro-ws 的目录 了，git clone 后本地运行，执行 node index.js 将会在 http://127.0.0.1:3000...代码里，我们需要检测 FIN 的值，如果为 0 说明有分片，需要记录第一个 FIN 为 0 时的 opcode 值，缓存到 this.frameOpcode 属性中，将载荷缓存到 this.frames...5、总结 从刚开始决定阅读 Websocket 协议，到自己使用 Node.js 实现一套简单的 Websocket 协议，到这篇文章的产出，前后耗费大约 1 个月时间（拖延症。。。）。
强缓存验证.jpg HTML时间和JS时间不一致，说明强缓存生效。...而协商缓存，顾名思义， 需要和服务器协商一下，看资源是否需要更新。若协商结果是需要更新则会返回更新的内容。若结果是不需要则只返回304状态码，这样可以有效减轻服务器压力。...4 过期时直接返回200并在body中放入更新内容。 5 如果未过期则直接返回304状态码。...res.statusCode = 304 res.end() return } 协商缓存验证.jpg 协商缓存命中.jpg 2.2.2 etag & if-None-Match...4 过期时直接返回200并在body中放入更新内容。 5 如果未过期则直接返回304状态码。
客户端会缓存请求过的静态资源（图片，CSS 文件，JS文件等），当用户再次请求相同的url时，浏览器会根据缓存规则判断是否使用已经缓 存的静态资源文件，或者绕过资源缓存直接请求服务器重新获取资源。...（b）no-cache：每次发起请求都需要验证缓存资源的新鲜度，新鲜度满足则返回304状态码，使用缓存资源，否则返回200状态码，返回资源主体（c）no-store：不缓存，每次请求需要从服务器重新获取资源...（b）当资源过期请求携带首部If-None-Match赋值Etag的标识值，与服务资源标识进行比对，如果发生变化则变化则返回200状态码和资源主体，否则返回304状态码 缓存分类 HTTP缓存可以根据缓存过程分为强制缓存和协商缓存...缓存生效，返回304状态码 缓存失效，返回200状态码和新的资源结果，浏览器加载资源并且更新本地缓存 协商缓存相关的首部：Last-Modified / If-Modified-Since和Etag /...浏览器将JS脚本资源和图片资源存储在内存缓存，css，xml文件存储的硬盘文件。 当浏览器刷新时，js，图片等资源直接从内存中加载，css文件需要重用从硬盘读取并解析渲染到页面。
什么是http缓存呢，当我们使用chrome浏览器，按F12打开控制台，在网络请求中有时候看到状态码是200，有时候状态码是304，当我们去看这种请求的时候，我们会发现状态码为304的状态结果是：Status...Code: 304 Not Modified，而状态码为200的时候一般会有四种情况，一种是直接返回200，没有任何其他的标志，另一种是Status Code: 200 OK (from memory...其实我们可以按状态码来区分其为两大类，分别是写上缓存--304和强制缓存--200 协商缓存（304） 这种方式使用到了headers请求头里的两个字段，Last-Modified & If-Modified-Since...200状态码和304状态码何时出现 在没有设置Cache-Contral的情况下，设置Last-Modified和ETag缓存，会出现200（from cache）和304 交替出现的情况。...通过下图我们可以清晰的明白200和304 ?
没有被修改，返回304 If-UnModified-Since If-UnModified-Since 时间后 未修改，返回 200 被修改，返回 412 Precondition failed 预处理错误...如果不一样，返回 412 If-None-Match 如果和 请求资源的 ETag不一样，返回 200 如果一样，返回304 缓存类型 强缓存 一旦命中强缓存，浏览器就不会发送请求，而是直接读取缓存...当客户端缓存了目标资源，但是不确定是否是最近的版本，会发一个条件请求，附带上 条件首部 服务器拿到首部，判断出客户端的资源是否是最新的 如果是最新的，返回304，但是没有响应体，客户端收到304...用户手动刷新，不包括强刷 缓存资源类型 1、文件可以缓存，比如 js、css、json 2、post 无法缓存，get 请求可以缓存 3、还有其他的我不知道..........所以，可以得出 1、ajax 请求的缓存都放在 disk 2、 页面引入的 js、css 都放在 memory 缓存过期时间计算 响应返回 Cache-Control： 当同时添加 max-stale，
当我们代开某个网站，如 baidu.com，我们可以看到 size 这一列有一些 js 标识为 disk cache，这里就是应用到了缓存。...浏览器不会向服务器发送任何请求，直接从本地缓存中读取缓存数据并返回 200 状态码，如下图所示。...再次请求数据时，就会在请求 header 中带上缓存的标识发送给服务器，服务器根据缓存标识对比，如果发生变化，则返回 200 状态码，返回完整的响应数据给浏览器，如果未发生更新，则返回 304 状态码告诉浏览器继续使用缓存数据...如果不一样，说明资源被修改过，则返回完整的响应，状态码 200。如果一样，说明资源未被修改过，则返回 304 状态码，告诉浏览器继续使用缓存的数据。...(gif|jpg|png|css|js)(.*) { proxy_cache cache_zone; proxy_cache_valid 200 302
2 服务器版本更新与客户端不同步的问题 http状态304表示请求的是缓存，200表示是从服务器请求的。..." src= "static/image1.jpg"> 然后我们刷新一下，发现200的变成了304，因为图片已经缓存在了本地。...以下是3张相同的image1照片，明显都是存在了本地缓存中 <img alt="" width="<em>200</em>px" src="static/image1.jpg?...同理CSS,<em>JS</em>也应该加入时间戳，下次再修改代码的时候避免因为<em>缓存</em>原因没有同步。
在看200（cache）和304区别的时候，翻到了雅虎这边归纳出来的准则，虽然是十多年前的东西了吧，但是还是具有参考价值的，因此在原文基础上我进行了一些归纳翻译。...附200（cache）与304区别： 200（cache)即浏览器使用本地缓存版本，最快，因为不用向web服务器发请求。...，则会304，然后使用浏览器缓存版本。...即浏览器检查文件是否自其缓存的最后一个版本后是否被修改的响应（304s, on the other hand, are the response of the server after the browser...从这个角度看，对于文件使用尽可能长的缓存时间（expires或cache-control：max-age），直接从200（cache）这种方式获取。如果文件有改动，修改文件名字或请求时带上版本号。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
云直播
对象存储
