Vercel缓存响应时长超预期：NextJS 13 API路由缓存配置异常

问题描述 #

运行NextJS 13 API路由，设置响应头：

Cache-Control: public, max-age=0, s-maxage=1, stale-while-revalidate=0

预期Vercel边缘缓存响应1秒，但实际缓存时长远超预期（至少数分钟），间隔数分钟请求仍返回X-Vercel-Cache: HIT和304 Not Modified状态码，甚至不设置Cache-Control头问题依然存在。

解决步骤 #

• 排除浏览器协商缓存干扰：304状态码来自协商缓存，浏览器会发送If-None-Match/If-Modified-Since请求头，Vercel边缘缓存匹配后返回缓存内容。测试时可通过强制刷新（Ctrl+F5）或禁用浏览器缓存，观察是否仍返回HIT。
• 显式覆盖协商缓存头：在API路由中主动设置ETag为空字符串，或动态更新Last-Modified，避免Vercel依赖协商缓存延长有效时间。示例代码：

export async function GET(req) {
  const responseData = JSON.stringify({ data: "实时内容" });
  return new Response(responseData, {
    status: 200,
    headers: {
      "Cache-Control": "public, max-age=0, s-maxage=1, stale-while-revalidate=0",
      "ETag": "",
      "Last-Modified": new Date().toUTCString(),
    },
  });
}

• 强制禁用默认缓存：若不设置Cache-Control时仍被缓存，可显式设置严格的无缓存策略测试：

Cache-Control: no-store, must-revalidate

• 检查NextJS路由级缓存配置：确认API路由所在的路由组或页面未设置revalidate属性，该配置会优先覆盖API路由的Cache-Control头。

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