Next.js Discord

Discord Forum

Does revalidatePath() still work?

Answered
Txie posted this in #help-forum
Open in Discord
Avatar
import { NextRequest, NextResponse } from 'next/server';
import { revalidatePath } from 'next/cache';

const SECRET_TOKEN = "random";

export const revalidate = true;

export async function GET(req: NextRequest) {
  const { searchParams } = new URL(req.url);
  const secret = searchParams.get('secret');
  const path = searchParams.get('path');

  if (secret !== SECRET_TOKEN) {
    return NextResponse.json({ message: 'Invalid token' }, { status: 401 });
  }

  if (!path) {
    return NextResponse.json({ message: 'Path is required' }, { status: 400 });
  }

  try {
    console.log(`Revalidating path: ${path}`);
    revalidatePath(path);
    return NextResponse.json({ revalidated: true });
  } catch (err) {
    console.error('Revalidation error:', err);
    return NextResponse.json({ message: 'Error revalidating' }, { status: 500 });
  }
}
Answered by Txie
Solution is to use vercel aws amplify wont resolve this issue since it seems to not be a priority.
View full answer

25 Replies

Avatar
Yea @Txie (god this code is so similar to what i do myself for revalidating from our cms)
but this wont work for instant updates
like when you update something on a page you are on, and you want to see it instantly udate you need to call revalidatePath from a server action instead of a route handler
Avatar
Im new to App Router since I've been using Page Router so like create a app/actions/revalidatePathAction.ts
Then something like
'use server';

import { revalidatePath } from 'next/cache';

export default async function revalidatePathAction(path: string) {
console.log(Revalidating path: ${path});
revalidatePath(path);
}
Avatar
pretty sure you need to directly mutate calling the action
and that wont work
so like onClick you call a server action
if you are revalidating a diff path, then no need for server actions
since you arent gonna see live updaes for a page you arent on which you didnt mutate
Avatar
Hmm I have like another server which I use tiptap rich text editor that updates a database for content for blogs and then this website which Im trying to ISR pages for the blog. I dont really want to revalidate the content on a timer but more of a api call to update it since I would prefer it to be instant
Avatar
ok so just do what you did before
route handlers will make the data update on the next visit
thats what i did for my cms revalidation to my blogs website
Avatar
Im doing that but when I deploy the website on aws amplify it doesn't revalidate when I call that api and the api status works it gives me 200
// app/blogs/[slug]/page.tsx
import React from 'react';
import { query } from '@/lib/db'; // Adjust the import according to your path

interface Post {
  slug: string;
  title: string;
  content: string;
}

// Fetch the slugs for all posts
export async function generateStaticParams() {
  const res = await query('SELECT slug FROM posts');
  const posts = res.rows;

  return posts.map((post: { slug: string }) => ({
    slug: post.slug,
  }));
}

// Fetch the post data based on the slug
const fetchPost = async (slug: string): Promise<Post | null> => {
  const res = await query('SELECT slug, title, content FROM posts WHERE slug = $1', [slug]);
  if (res.rows.length === 0) {
    return null;
  }
  return res.rows[0];
}

const BlogPost = async ({ params }: { params: { slug: string } }) => {
  const post = await fetchPost(params.slug);

  if (!post) {
    return <div>Post not found</div>;
  }

  return (
    <div>
      <h1>{post.title}</h1>
      <div dangerouslySetInnerHTML={{ __html: post.content }} />
    </div>
  );
};

export default BlogPost;
// app/api/revalidate/route.ts
  import { NextRequest, NextResponse } from 'next/server';
  import revalidatePathAction from '@/app/actions/revalidatePathAction';

  const SECRET_TOKEN = "random";

  export async function POST(req: NextRequest) {
    const { searchParams } = new URL(req.url);
    const secret = searchParams.get('secret');

    if (secret !== SECRET_TOKEN) {
      return NextResponse.json({ message: 'Invalid token' }, { status: 401 });
    }

    try {
      const body = await req.json();
      const { path } = body;

      if (!path) {
        return NextResponse.json({ message: 'Path is required' }, { status: 400 });
      }

      // Revalidate the path
      await revalidatePathAction(path);

      return NextResponse.json({ message: 'Path revalidated' });
    } catch (err) {
      console.error('Error revalidating path:', err);
      return NextResponse.json({ message: 'Error revalidating path' }, { status: 500 });
    }
  }
Avatar
does it work in local prod?
Avatar
How do I test it in local prod? npm run build and npm run start
Yes it works on local prod
So then its aws amplify =/
Do you know how to fix something like this?
Avatar
sorry no clue, probs google if an issue for it exists?
Avatar
aight thanks for the help
Avatar
np, if you find something related, send it here.. if you dont find anything just mark the does it work one of my previous answers on your api route :D
Avatar
Solution is to use vercel aws amplify wont resolve this issue since it seems to not be a priority.
Answer