http - 浏览器是否应该自动处理 304 响应?

标签 http caching browser etag http-status-code-304

可能是个愚蠢的问题,但我还没有找到任何明确的答案。

我的服务器为我们拥有的一些相当大的 JSON 响应处理 ETag 缓存,如果 If-None-Match header 包含相同的内容,则返回带有空主体的 304 NOT MODIFIED hash 作为新生成的(浅 ETags)。

浏览器是应该自动处理这个问题,还是异步使用 API 的浏览器客户端应用程序需要实现一些逻辑来处理此类响应(即,如果响应 304,则使用缓存版本,否则创建/更新缓存版本)?

因为到目前为止,我已经在客户端手动实现了这个逻辑,但我想知道我是否只是重新发明了一个方轮......


换句话说,以 Cache-Control header 为例,浏览器客户端应用程序不需要解析该值,检查 max-age例如,以某种方式存储它,设置超时等:一切都由浏览器直接提前处理。问题是:浏览器在收到 304 时是否应该以相同的方式运行?


到目前为止,这是我编写客户端的方式(使用 AngularJS 构建,在浏览器中运行):

myModule

  .factory("MyRepository", ($http) => {

    return {
      fetch: (etag) => {
        return $http.get(
          "/api/endpoint",
          etag ? { headers: { "If-None-Match": etag } } : undefined
        );
      }
    };

  })

  .factory("MyService", (MyRepository, $q) => {

    let latestEtag = null;
    let latestVersion = null;

    return {
      fetch: () => {
        return MyRepository
          .fetch(latestEtag)
          .then((response) => {
            latestEtag = response.headers("ETag");
            latestVersion = response.data;
            return angular.copy(latestVersion);
          })
          .catch((response) => {
            return 304 === error.status
              ? angular.copy(latestVersion)
              : $q.reject(response)
          });
      }
    };

  });

所以基本上,是否有效地需要上述逻辑,或者我应该能够直接使用 $http.get("/api/endpoint")

上面的这段代码运行良好,这似乎意味着它需要以编程方式处理,尽管我在阅读的文章中从未见过这样的“自定义”实现。

最佳答案

304 响应由浏览器自动处理

所以我创建了一个简单的页面

<html>
<head>
<script src="./axios.min.js"></script>
<script src="./jquery-3.3.1.js"></script>
</head>
<body>
<h1>this is a test</page>
</body>
</html>

并添加了一个test.json文件

root@vagrant:/var/www/html# cat test.json
{

"name": "tarun"

}

然后在nginx下面添加

location ~*  \.(jpg|jpeg|png|gif|ico|css|js|json)$ {
   expires 365d;
}

现在的结果

AXIOS

AXIOS

如您所见,第一个请求是200,第二个请求是304,但对JS代码没有影响

jQuery

jQuery response

jQuery 也一样

从 curl 你可以看到服务器在第二次 304 请求中没有发送任何东西

$ curl -v 'http://vm/test.json' -H 'If-None-Match: "5ad71064-17"' -H 'DNT: 1' -H 'Accept-Encoding: gzip, deflate' -H 'Accept-Language: en-US,en;q=0.9' -H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36' -H 'Accept: */*' -H 'Referer: http://vm/' -H 'X-Requested-With: XMLHttpRequest' -H 'Connection: keep-alive' -H 'If-Modified-Since: Wed, 18 Apr 2018 09:31:16 GMT' --compressed
*   Trying 192.168.33.100...
* TCP_NODELAY set
* Connected to vm (192.168.33.100) port 80 (#0)
> GET /test.json HTTP/1.1
> Host: vm
> If-None-Match: "5ad71064-17"
> DNT: 1
> Accept-Encoding: gzip, deflate
> Accept-Language: en-US,en;q=0.9
> User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36
> Accept: */*
> Referer: http://vm/
> X-Requested-With: XMLHttpRequest
> Connection: keep-alive
> If-Modified-Since: Wed, 18 Apr 2018 09:31:16 GMT
>
< HTTP/1.1 304 Not Modified
< Server: nginx
< Date: Wed, 18 Apr 2018 09:42:45 GMT
< Last-Modified: Wed, 18 Apr 2018 09:31:16 GMT
< Connection: keep-alive
< ETag: "5ad71064-17"
<
* Connection #0 to host vm left intact

因此您不需要处理 304,浏览器会为您完成这项工作。

关于http - 浏览器是否应该自动处理 304 响应?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49751311/

相关文章:

php - 在 PHP 中检测浏览器退出

Javascript 拼写检查方法

python - webbrowser.get ("firefox") 在装有 Firefox "could not locate runnable browser"的 Mac 上

php - PHP 有自己的 Web 服务器吗?

json - 响应中的有效 JSON

java - 如何将图片从android上传到java

python - 使用 Flask Cache 和 memcached 存储简单的键值对

http - 对于健康检查失败,我应该使用哪个 HTTP 状态代码?

caching - nginx 没有在磁盘上缓存代理响应,即使我要求它这样做

php - codeigniter 缓存总是返回空