AJAX GET请求未被浏览器缓存，如何配置Nginx及代码实现缓存？

看起来你遇到的是个典型的缓存配置坑——明明Nginx已经设置了缓存头，但浏览器就是每次都绕开缓存去请求后端。我帮你拆解几个关键排查点和解决方法：

1. 先搞定jQuery的自动缓存禁用 #

这是最容易踩的坑：jQuery的$.get方法默认会给GET请求自动追加一个时间戳参数（比如_=1622345678），导致每次请求的URL都不一样，浏览器自然不会识别为同一个资源去缓存。

解决方法很直接，改用完整的$.ajax配置显式开启缓存，或者全局调整AJAX行为：

方案A：给单个请求开启缓存 #

把你的$.get调用替换成带缓存配置的$.ajax：

$.ajax({
  url: '/api/get_data_from_cache_with_timeout2sec',
  method: 'GET',
  cache: true, // 关键：强制开启缓存
  success: function(data, status, xhr) {
    // 你的业务处理逻辑
  }
});

方案B：全局开启GET请求缓存 #

如果你的项目里有很多AJAX GET请求都需要缓存，可以全局设置一次：

$.ajaxSetup({
  cache: true
});

这样所有$.get和默认的$.ajax GET请求都会保留缓存行为。

2. 确认Nginx配置没有冲突 #

你的Nginx配置expires 10m;本身是正确的，它会自动生成Cache-Control: max-age=600和对应的expires响应头（和你看到的结果一致）。但要检查有没有其他指令干扰缓存：

• 确保配置里没有额外的add_header Cache-Control "no-cache";或add_header Pragma "no-cache";，这些会直接覆盖expires的缓存设置。
• 如果响应头里有Vary: Cookie这类字段，而你的请求携带了变化的Cookie，浏览器会认为每个Cookie对应的内容不同，不会复用缓存。如果不需要按Cookie区分缓存，可以在Nginx里添加：

add_header Vary "";

3. 检查浏览器测试环境的小细节 #

别忽略这个容易被忽略的点：

• 打开浏览器开发者工具（F12），切换到Network面板，看看是否勾选了Disable cache选项。如果勾选了，浏览器会强制跳过所有缓存，测试前一定要关掉。
• 查看请求头里有没有Cache-Control: no-cache或Pragma: no-cache，如果有，说明请求本身在告诉浏览器不要缓存——开启cache: true的AJAX配置会自动避免添加这些头。

4. 验证缓存是否生效 #

修改后测试时，观察Network面板的请求状态：

• 第一次请求应该返回200 OK，并带有正确的expires和Cache-Control头。
• 第二次及以后的请求应该显示200 OK (from disk cache)或200 OK (from memory cache)，耗时会降到100ms以内，完全符合你的预期。

内容的提问来源于stack exchange，提问作者Timur Nurlygayanov