Next.js中不启用ISR时如何防止静态生成页面被缓存

我完全明白你的痛点——既要确保每次部署后CDN能立刻刷新静态页面，又不想因为ISR的revalidate: 1造成不必要的服务器资源浪费，而且Next.js默认的缓存策略和被覆盖的next.config.js头设置确实让人头疼。下面是几个可行的解决方案，你可以根据自己的部署环境选择：

1. 使用自定义Next.js服务器修改响应头 #

这是最直接的方式，因为你已经在尝试自定义服务器了。你可以在服务器层面拦截SSG页面的响应，手动设置Cache-Control头，绕过Next.js的默认覆盖逻辑。

比如用Express搭建自定义服务器的示例：

import express from 'express';
import next from 'next';

const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();

app.prepare().then(() => {
  const server = express();

  // 针对你的SSG页面路径设置自定义Cache-Control
  server.get('/entity/:id', async (req, res) => {
    // 让Next.js处理页面渲染/静态文件返回
    await handle(req, res);
    // 覆盖默认的Cache-Control头
    res.setHeader('Cache-Control', 'public, max-age=0, must-revalidate');
  });

  // 其他请求默认处理
  server.all('*', (req, res) => {
    return handle(req, res);
  });

  server.listen(3000, (err) => {
    if (err) throw err;
    console.log('> Ready on http://localhost:3000');
  });
});

这样处理后，SSG页面的响应头会被你自定义的规则覆盖，CDN每次都会回源验证，但因为是静态生成的页面，服务器直接返回预构建的HTML文件，不会触发重新渲染，完全避免了资源浪费。

2. 使用Edge Middleware（推荐，无需自定义服务器） #

如果你不想维护自定义服务器，可以用Next.js的Edge Middleware，它运行在CDN边缘节点，能直接修改响应头，而且不会影响服务器的资源使用。

创建middleware.ts文件在项目根目录：

import { NextResponse } from 'next/server';
import type { NextRequest } from 'next/server';

export function middleware(request: NextRequest) {
  const response = NextResponse.next();

  // 匹配你的SSG页面路径
  if (request.nextUrl.pathname.startsWith('/entity/')) {
    // 设置自定义Cache-Control头
    response.headers.set('Cache-Control', 'public, max-age=0, must-revalidate');
  }

  return response;
}

// 指定匹配的路径
export const config = {
  matcher: '/entity/:path*',
};

Edge Middleware会在请求到达服务器前拦截处理，直接修改响应头，Next.js的默认缓存策略不会覆盖这个设置，而且这种方式性能更好，适合生产环境。

3. 结合CDN的缓存刷新策略（替代方案） #

如果上述代码层面的修改有困难，你可以在CDN配置里做文章：

• 在每次部署新版本后，调用CDN的API批量刷新所有静态页面的缓存；
• 给静态页面的URL加上部署版本号作为查询参数（比如/entity/123?v=1.0.0），每次部署更新版本号，这样CDN会认为是新的URL，自动获取最新内容。不过这个方案需要你在构建时或者路由跳转时处理版本号，适合对代码侵入性要求低的场景。

另外，你提到的next.config.js里的headers被覆盖，原因是Next.js对SSG页面有默认的缓存策略优先级，会忽略自定义的headers配置，所以必须用上述更上层的方式来修改。

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