revalidateTag not work at vercel deploy

Current versus Expected behavior:

Current behavior: The revalidateTag function works locally but does not update the cache on Vercel.
Expected behavior: The cache should be updated when using revalidateTag on Vercel.

Code, configuration, and steps that reproduce this issue:

const protocal = process?.env.NODE_ENV === "development" ? "http" : "https";
    const response = await fetch(`${protocal}://${host}/api/get-all-post`, {
        method: 'GET',
        next: { tags: ['posts'] },
      });
'use server'

import { NextResponse } from 'next/server';
import supabaseClient from '@/utils/supabase/CsrClient';

export async function GET(req: Request): Promise<NextResponse> {
  try {
    let allNotes: any[] = []; // 모든 게시물 저장
    let offset = 0;
    const limit = 200;

    while (true) {
      const { data: notes, error } = await supabaseClient
        .from('posts')
        .select()
        .range(offset, offset + limit - 1) // 200개씩 가져오기
        .order('date', { ascending: false });

      if (error) {
        return NextResponse.json({ error: error.message }, { status: 400 });
      }

      if (!notes || notes.length === 0) {
        break; // 더 이상 데이터가 없으면 종료
      }

      allNotes = allNotes.concat(notes); // 가져온 데이터를 모두 합침
      offset += limit; // 다음 200개를 가져오기 위해 offset 증가
    }
    return NextResponse.json({ notes: allNotes }, { status: 200 });
  } catch (err) {
    return NextResponse.json({ error: 'Failed to process request' }, { status: 500 });
  }
}

I am getting supabase data at fetching function
and revalidate at post api

'use server'

import { NextResponse } from 'next/server';
import supabaseClient from '@/utils/supabase/CsrClient';
import { revalidateTag } from 'next/cache';

export async function POST(req: Request): Promise<NextResponse> {
    try {
      const { uuid, titleimage, title, content, date, tags, category } = await req.json();
  
      const { data, error } = await supabaseClient
        .from('posts')
        .insert([{ uuid, titleimage, title, content, date, tags, category }]);
  
      if (error) {
        return NextResponse.json({ error: error.message }, { status: 500 });
      }
      revalidateTag('posts')
      return NextResponse.json({ message: 'Post added successfully', data });
    } catch (err) {
      if (err instanceof Error) {
        return NextResponse.json({ error: err.message }, { status: 500 });
      }
      return NextResponse.json({ error: 'An unknown error occurred' }, { status: 500 });
    }
  }


  1. Deploy the Next.js project to Vercel.
  2. Use the revalidateTag function to update the cache.
  3. Observe that the cache is not updated on Vercel.

Project information (URL, framework, environment, project settings):

  • Framework: Next.js
  • Environment: Vercel

When using revalidateTag in Next.js with Edge functions, I encountered an issue because the example code in the Next.js documentation was using 'use server', which prevents exporting runtime = 'edge' because server functions require an async function. This was causing a problem in my setup.

Solution:

I removed the 'use server' directive and directly added export const runtime = 'edge'; in the file. This allowed the Edge function to properly execute, and revalidateTag started working as expected.

and so, It worked!

Thank you for coming back with a solution that worked for you! :smile:

See you around in the community :sparkles:

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.