浏览器缓存：Json响应

Question

我试图使用Etag缓存来自api请求的json响应。 我正在打电话这样的东西http：// localhost：3000 / api / config并得到：

响应标题：
缓存控制：公共，最大年龄= 31557600
连接：保持活跃
内容长度：11
内容类型：应用/ JSON; 字符集= utf-8的
日期：2015年5月13日，星期三11:41:52 GMT
ETag的： “94d52736bcd99b1ac771f13b1bbdf622”
X-已启动方式：快递

共振：{id：1}

我希望浏览器缓存响应并发送带有“ f5”的下一个请求触发的Etag。 但是事实并非如此。

请求标头第二个请求：
接受：text / html，application / xhtml + xml，application / xml; q = 0.9，image / webp， / ; q = 0.8
接受编码：gzip，deflate，sdch
接受语言：DE-DE，DE; Q = 0.8，EN-US; Q = 0.6，连接; Q = 0.4
缓存控制：无缓存
连接：保持活跃
主持人：本地主机：3000
附注：无缓存
用户代理：Mozilla / 5.0（Windows NT 6.1; WOW64）AppleWebKit / 537.36（KHTML，例如Gecko）Chrome / 42.0.2311.135 Safari / 537.36

那么，不可能通过直接的api请求来缓存纯json响应吗？
还是我想念什么。

该api是通过express完成的节点js测试实现：

router.get('/config', function(req, res) {
    var eTag = crypto.createHash('md5').update(JSON.stringify(config)).digest('hex');
    res.setHeader('ETag', '"' + eTag + '"');
    res.setHeader('Content-Type', 'application/json');
    res.setHeader('Cache-Control', 'public, max-age=31557600');
});

带有chrom（42.x）和firefox（37.x）的睾丸

谢谢。

Answer 1

嗨，这段代码似乎对我有用：

router.get('/config', function(req, res) {
    var eTag = crypto.createHash('md5').update(JSON.stringify(config)).digest('hex');

    if (req.headers['if-none-match'] && req.headers['if-none-match'] === '"' + eTag + '"') {
        res.status(304);
        res.end();
    } else {
        res.setHeader('ETag', '"' + eTag + '"');
        res.setHeader('Content-Type', 'application/json');
        res.setHeader('Cache-Control', 'public, max-age=31557600');
        res.send(JSON.stringify(config));
    }
});

使用浏览器网址栏http：// localhost：3000 / api / config调用api

Answer 2

看起来您可能正在使用chrome。 Chrome应该在请求中的“ f5”之后包含以下标头：

If-None-Match:"94d52736bcd99b1ac771f13b1bbdf622"

如果看不到此内容，请检查Chrome设置/常规，并确保未选中“禁用缓存（在打开DevTools时）：

Answer 3

使用jQuery，我们可以使用ifModified选项：

$.ajax({
   type: "GET",
   ifModified: true,
   url: "http://localhost:3000/api/config"
}).then(function(data) {
   . . .
});