http获得304，但仍下载内容 [英] http got 304 but still download content

问题描述

我请求了一个html文件，并且获得了HTTP状态代码304.我知道这意味着内容尚未修改.因此，浏览器可以使用缓存.但是我注意到在请求时间信息内容下载中使用了2.63秒.

I requested a html file, and I got http status code 304. I know it means the content hasn't been modified.So browser can use cache. But I noticed in the request timing info content downloading used 2.63s.

我使用Chrome开发工具进行调试.

I debugged with Chrome dev tools.

由于浏览器具有缓存，为什么它仍下载内容?

Since browser had cache, why it still downloaded content?

推荐答案

检出缓存的新鲜度和陈旧状态之间的区别.

Checkout the difference between freshness and stale state of cache.

阶段1:第一次请求.向服务器发出请求并获得资源.每种资源都是新鲜获取的

Stage 1: Requesting for very 1st time. Made request to server and got resources. Each resource is fetched freshly

在我的情况下，我的js文件的标头为cache-control:public, max-age=3，这意味着缓存在3秒钟内从新的状态变为陈旧状态(花费更少的时间来展示差异)

In my case, headers for my js files is cache-control:public, max-age=3, meaning, cache becomes stale from fresh in 3 seconds(pretty less time taken to demonstrate difference)

状态2:.再次请求(Ctrl + Refresh).现在，由于我的缓存已过期，它会将请求发送到服务器，这表明未修改资源.因此，这些资源并没有完全获取.仅获取标头.请注意，在每种情况下，传输的字节数(每次约为220字节)仅适用于那些资源的标头.因此304(未修改)在不再次传输正文时节省了很多kbs. 我的资源新鲜度为STALE，这就是它向服务器发送请求的原因

State 2: Again requesting (Ctrl+Refresh). Now, since my cache is stale, it sends requests to server, which tells that resource are not modified. Hence those resources AREN'T fetched entirely. Only the headers are fetched. Carefully note the bytes(~220bytes for each) transfer in each case which is only for headers of those resources. Hence 304(Not Modified) saved the lot of kbs in not transferring body again. Freshness of my resources was STALE which is why it sent request to server

当您检查主体时，第二个响应与第一个响应相同，但BTU主体是从陈旧的缓存中获取的，并且资源缓存再次标记为FRESH 3秒.

And when you check the body, the response in 2nd is same as 1st, BUT body is taken from stale cache and the resource cache is again marked FRESH for 3 seconds.

请注意，在我的情况下，我可以通过将高速缓存的最大使用期限设置为1年(最高)来进行优化，因为我对每个文件都使用了chunkhash，这会告诉浏览器不要向服务器发出请求并直接采用来自缓存，它给出响应 200(来自缓存)，因为您可以看到 Stage2 中标题为cache-control:public, max-age=7200

Note, in my case, I can optimise by setting cache max-age to be 1 year(some high no.) because I'm using chunkhash for each file which would tell browser to not make request to server and directly take from cache which gives response 200 (from cache) as you can see analytics file in Stage2 whose headers are cache-control:public, max-age=7200

这篇关于http获得304，但仍下载内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！