CODEWITHSUNDEEP
next.jsnextjs14app-router
D. Rattansingh
D. Rattansingh

Reputation: 1669

My ISR cache in next.js app router is not revalidating

I'm trying to do incremental static regeneration (ISR) in next.js app router. This is what I came up with:

export default async function AdminPanel(){
    //Fetch user management page with ISR caching
    const data=await fetch(process.env.NEXT_PUBLIC_NodeURL+'/admin/panel/api',{
        next:{ revalidate: 86400}//24 hrs revalidate
    }).then((response)=>response.json())

return(//use data etc

And my code in the fetch directory

import { NextResponse } from 'next/server';

import { getISRdata_adminPanel_controller } from '@/server/controllers/admin';

// called from admin/panel/page.js
export async function GET(){
    return NextResponse.json(await getISRdata_adminPanel_controller())
}

It is working and I'm getting my data. My question is concerning the revalidation, shouldn't it refresh the cache every 24 hours according to my interval? I uploaded my project on vercel and changed the data but has been waiting 4 days now but the cache still has not refreshed. I assumed a revalidation interval of 1 means 1 second so 84600 equals 24 hours; or am I wrong? How to set this to refresh every 24 hours?

UPDATE

For some reason it started working on vercel after I put this in my fetch directory export const dynamic="force-dynamic";//Forces fresh data every request

Upvotes: 0

Views: 61

Answers (2)

Ranu Vijay
Ranu Vijay

Reputation: 1297

I guess you will also have to look at Cache-Control header of the page and its values, this can help vercel to return the page directly from edge network only, you might have values public, immutable, and may be the reason for revalidation not working.

I'm not 100% sure but once try changing revalidation time to 2 minutes and Cache-Control headers to never cache anything and try. also can read more here - https://vercel.com/docs/edge-network/caching

Upvotes: 0

afzaal nazir
afzaal nazir

Reputation: 1

ISR caching isn't revalidating likely due to vercel global caching layer or misconfigured fetch options

Solutions:

1- Ensure fetch uses next: { revalidate: 86400 }

Try forcing revalidation:

await fetch(process.env.NEXT_PUBLIC_NodeURL + '/admin/panel/api', {
  next: { revalidate: 86400 },
  cache: "no-store",
});

2- Use revalidatePath() (Next.js 13+ with App Router) in an API route:

import { revalidatePath } from 'next/cache';

export async function GET() {
    revalidatePath('/admin/panel');
    return NextResponse.json({ revalidated: true });
}

If ISR still doesn’t work try deploying a new version as Vercel sometimes locks the cache for deployed builds

Upvotes: 0

Related Questions