Next.js Discord

Discord Forum

issue with revalidateTag()

Answered
Southeastern blueberry bee posted this in #help-forum
Open in Discord
Southeastern blueberry beeOP
revalidateTag() doesn't work all the time, sometimes the cache is not invalidated even when called with the corresponding tag, I use it to invalidate the cache initiated with unstable_cache()

I tried debugging with the NEXT_PRIVATE_DEBUG_CACHE environment variable, observing whether the tags were identical, which was the case, but nothing helped.

here is the code:

api/rated/[accountid]/movies/route.ts
...
const getCachedMoviesRating = async (sessionid: string, accountId: string) => {
  const cachedMoviesRating = unstable_cache(
    async (accountId) => getMoviesRating(sessionid, accountId),
    [accountId],
    { tags: [`rated:${accountId}`] },
  );
  const favs = await cachedMoviesRating(accountId);
  return favs;
};
...
/api/movie/[sessionid]/[accountid]/[movieid]/rating/route.ts
...
const result = await fetcher<ITMDBStatusResponse>(
      `${process.env.BASETMDBURL}/movie/${params.movieid}/rating`,
      {
        body: JSON.stringify({
          value,
        }),
      },
      {
        tmdbContext: {
          api_key: process.env.TMDB_API_KEY!,
          session_id: params.sessionid,
        },
      },
    );
revalidateTag(`rated:${params.accountid}`);
...
Answered by Southeastern blueberry bee
I think this is a design error, revalidateTag() should return a promise and not nothing because if we call it in a route handler the response can be returned even before the cache is invalidated, my fix was to wrap revalidateTag() in a promise with a fairly large delay
await new Promise((resolve, reject) => {
    setTimeout(() => {
      revalidateTag(`rated:${params.accountid}`);
    }, 5000);
  });
  return Response.json({ revalidate: true, result });
View full answer

7 Replies

Southeastern blueberry beeOP
i can provide link for testing the behavior in production just ask me in dm thank you verry much
Southeastern blueberry beeOP
I think this is a design error, revalidateTag() should return a promise and not nothing because if we call it in a route handler the response can be returned even before the cache is invalidated, my fix was to wrap revalidateTag() in a promise with a fairly large delay
await new Promise((resolve, reject) => {
    setTimeout(() => {
      revalidateTag(`rated:${params.accountid}`);
    }, 5000);
  });
  return Response.json({ revalidate: true, result });
Answer
just wondering, why arent you just using fetch cache: https://nextjs.org/docs/app/api-reference/functions/fetch#optionscache
@riský just wondering, why arent you just using fetch cache: <https://nextjs.org/docs/app/api-reference/functions/fetch#optionscache>
Southeastern blueberry beeOP
You mean instead of unstable_cache() use fetch with tags options ?
@riský just wondering, why arent you just using fetch cache: <https://nextjs.org/docs/app/api-reference/functions/fetch#optionscache>
Southeastern blueberry beeOP
I need to manipulate large data after fetching, using tags on fetch will cache only the request but not the data structure manipulation
But I didn't know you could use tags directly on fetch