NextJS 14验证期后仍返回旧缓存，忽略外部API错误响应

要让API路由缓存外部API的所有响应（成功/错误状态均缓存），只需对代码做以下3处修改：

1. 移除export const dynamic = 'force-dynamic'：该配置会强制API路由每次请求都重新执行，直接跳过响应缓存，与你的需求冲突。
2. 添加export const revalidate = 10：让整个API路由的响应（无论状态码）都缓存10秒，到期后自动重新请求外部API获取最新数据。
3. 移除fetch选项中的next: { revalidate: 10 }：现在依赖API路由级别的缓存，无需单独缓存fetch结果。

修改后的完整代码 #

export const revalidate = 10;
import { NextResponse } from 'next/server'

export async function GET() {
    try {
        console.log("PING : ", new Date().toLocaleTimeString())

        let res = await fetch(`http://localhost:4000/ping`, { method: "GET" })

        let data = await res.json()
        console.log("DATA : ", data);

        if (!res.ok) {
            console.log("Not OK", res.status);
            return NextResponse.json({ error: data.error }, {
                status: res.status,
                statusText: res.statusText
            })
        } else {
            console.log("OK", res.status);
            return NextResponse.json({ ...data }, {
                status: res.status,
                statusText: res.statusText,
            })
        }
    } catch (e) {
        console.log("Error");
        return NextResponse.json({ error: e.toString() }, {
            status: 500,
            statusText: "Internal Server Error"
        })
    }
}

原代码问题说明 #

• 你之前的dynamic: 'force-dynamic'强制API路由每次都执行，但fetch的next: revalidate会缓存成功响应（200-299状态码），导致后续即使外部API返回错误，fetch仍会复用缓存的200结果。
• Next.js默认fetch只缓存成功响应，不会缓存404/429/503等错误状态，因此无法实现错误响应的缓存。

修改后，API路由会将完整的响应（状态码+内容）统一缓存10秒，到期后重新请求外部API，完全符合你"验证期内返回缓存、到期后获取最新数据"的需求。

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