Ajax 请求被缓存了怎么办？

Mr.卫红提问于 2026-03-12 23:00:19 阅读 74

前端

我用 fetch 发起一个 GET 请求获取用户数据，但发现第二次请求直接返回了缓存结果，根本没发到服务器！明明后端数据已经变了。

试过在 URL 后面加时间戳参数，比如 ?t=Date.now()，虽然能绕过缓存，但感觉不太优雅。有没有更规范的解决办法？是不是应该让后端控制缓存头？

这是我的请求代码：

fetch('/api/user/profile')
  .then(res => res.json())
  .then(data => console.log(data));

我来解答赞 8 收藏

反馈

2 条解答

司空玉杰 Lv1

这个问题很常见，fetch 默认行为就是会读缓存的，特别是 GET 请求。

最规范的解决办法是在 fetch 里加 cache 选项：

fetch('/api/user/profile', {
cache: 'no-store'
})
.then(res => res.json())
.then(data => console.log(data));

no-store 的意思是告诉浏览器完全绕过缓存，每次都发请求到服务器。相应的还有 no-cache，它会缓存但每次用之前要跟服务器验证一下哪个更新。如果你想更彻底，可以在请求头里加：

fetch('/api/user/profile', {
cache: 'no-store',
headers: {
'Cache-Control': 'no-cache'
}
})

至于后端要不要控制缓存头，那是另外一层保障。对于这种用户数据这种频繁变化的接口，后端设置 Cache-Control: no-store, no-cache, must-revalidate 是最佳实践。不过前端自己控制 cache 选项是最直接的，优先级更高。

时间戳那种写法也不是不能用，就是太土了，URL 变得脏乎乎的，调试的时候看着难受。

2026-03-14 11:06

俊美 Dev Lv1

这个问题很常见，fetch 默认会遵守 HTTP 缓存规则，GET 请求很容易被浏览器缓存。

最直接的解决办法是在 fetch 配置里加 cache 选项：

fetch('/api/user/profile', {

  cache: 'no-store'  // 彻底禁用缓存，每次都发请求

})

  .then(res => res.json())

  .then(data => console.log(data))

cache 还有几个可选值：
- no-store 完全不缓存
- no-cache 缓存但每次都验证（类似 ETag 机制）
- reload 忽略缓存，重新获取

如果你想更规范一些，可以让后端在响应头里控制缓存行为。在后端加上：

// Node.js/Express 示例

res.set('Cache-Control', 'no-cache, no-store, must-revalidate');

res.set('Pragma', 'no-cache');  // 兼容 HTTP/1.0

res.set('Expires', '0');

这样前端不加任何配置也能禁用缓存。两种方式结合用最稳妥，前端防一手，后端再防一手。

时间戳那种做法确实 low，能用配置解决就用配置吧。

2026-03-12 23:02