I have created a Next.js API to fetch all histories from my database. The API implementation is as follows:

export async function GET(req: NextRequest) { 

await dbConnect();
try {
    const history = await getHistory();

    return new NextResponse(JSON.stringify(history), {
        status: 200,
        headers: { 
            "Content-Type": "application/json", 
            "Cache-Control": "no-store" 
        },
    });
} catch (error) {
    console.error(error);
    return NextResponse.json(
        { error: "an unexpected error occurred" },
        { status: 500 }
    );
}

}

The API worked as expected when I initially deploy it to Vercel. However, when I add new histories to the database and call the API again, it still returns the old response instead of fetching the latest data.

i am using nextjs14

I have already tried:

Adding "Cache-Control": "no-store" to prevent caching Confirming that new histories are added to the database Checking the API locally (it works fine and returns updated data)

Is there any additional caching mechanism in Vercel or Next.js that I should consider? How can I ensure that the API always fetches fresh data when called?

I have created a Next.js API to fetch all histories from my database. The API implementation is as follows:

export async function GET(req: NextRequest) { 

await dbConnect();
try {
    const history = await getHistory();

    return new NextResponse(JSON.stringify(history), {
        status: 200,
        headers: { 
            "Content-Type": "application/json", 
            "Cache-Control": "no-store" 
        },
    });
} catch (error) {
    console.error(error);
    return NextResponse.json(
        { error: "an unexpected error occurred" },
        { status: 500 }
    );
}

}

The API worked as expected when I initially deploy it to Vercel. However, when I add new histories to the database and call the API again, it still returns the old response instead of fetching the latest data.

i am using nextjs14

I have already tried:

Adding "Cache-Control": "no-store" to prevent caching Confirming that new histories are added to the database Checking the API locally (it works fine and returns updated data)

Is there any additional caching mechanism in Vercel or Next.js that I should consider? How can I ensure that the API always fetches fresh data when called?

• next.js
• caching
• vercel

1 Answer 1

Route Handlers are cached by default when using the GET method with the Response object in Next.js 14 .

You can opt out of caching by:

• Using the Request object with the GET method.
• Using any of the other HTTP methods.
• Using Dynamic Functions like cookies and headers.
• The Segment Config Options manually specifies dynamic mode.

You can read more about it in the Next.js docs here. This behavior was changed in Next.js 15, GET route handlers will no longer be cached by default, so you won't need any of this if you upgrade to Next.js 15.

For this particular case in Next.js 14 I would just add a segment config

export const dynamic = 'force-dynamic' //disable cache

export async function GET(req: NextRequest) { 

await dbConnect();
try {
    const history = await getHistory();

    return new NextResponse(JSON.stringify(history), {
        status: 200,
        headers: { 
            "Content-Type": "application/json", 
            "Cache-Control": "no-store" 
        },
    });
} catch (error) {
    console.error(error);
    return NextResponse.json(
        { error: "an unexpected error occurred" },
        { status: 500 }
    );
}