Movatterモバイル変換


[0]ホーム

URL:


Skip to content
Important
Security Advisory: React2Shell & two new vulnerabilities
Find out more

revalidatePath

Last updated October 17, 2025

revalidatePath allows you to invalidatecached data on-demand for a specific path.

Usage

revalidatePath can be called in Server Functions and Route Handlers.

revalidatePath cannot be called in Client Components or Proxy, as it only works in server environments.

Good to know:

  • Server Functions: Updates the UI immediately (if viewing the affected path). Currently, it also causes all previously visited pages to refresh when navigated to again. This behavior is temporary and will be updated in the future to apply only to the specific path.
  • Route Handlers: Marks the path for revalidation. The revalidation is done on the next visit to the specified path. This means callingrevalidatePath with a dynamic route segment will not immediately trigger many revalidations at once. The invalidation only happens when the path is next visited.

Parameters

revalidatePath(path: string, type?:'page'|'layout'):void;
  • path: Either a route pattern corresponding to the data you want to revalidate, for example/product/[slug], or a specific URL,/product/123. Do not append/page or/layout, use thetype parameter instead. Must not exceed 1024 characters. This value is case-sensitive.
  • type: (optional)'page' or'layout' string to change the type of path to revalidate. Ifpath contains a dynamic segment, for example/product/[slug], this parameter is required. Ifpath is a specific URL,/product/1, omittype.

Use a specific URL when you want to refresh asingle page. Use a route pattern plustype to refreshmultiple URLs.

Returns

revalidatePath does not return a value.

What can be invalidated

The path parameter can point to pages, layouts, or route handlers:

  • Pages: Invalidates the specific page
  • Layouts: Invalidates the layout (thelayout.tsx at that segment), all nested layouts beneath it, and all pages beneath them
  • Route Handlers: Invalidates Data Cache entries accessed within route handlers. For examplerevalidatePath("/api/data") invalidates this GET handler:
app/api/data/route.ts
exportasyncfunctionGET() {constdata=awaitfetch('https://api.vercel.app/blog', {    cache:'force-cache',  })returnResponse.json(awaitdata.json())}

Relationship withrevalidateTag andupdateTag

revalidatePath,revalidateTag andupdateTag serve different purposes:

  • revalidatePath: Invalidates a specific page or layout path
  • revalidateTag: Marks data with specific tags asstale. Applies across all pages that use those tags
  • updateTag: Expires data with specific tags. Applies across all pages that use those tags

When you callrevalidatePath, only the specified path gets fresh data on the next visit. Other pages that use the same data tags will continue to serve cached data until those specific tags are also revalidated:

// Page A: /blogconstposts=awaitfetch('https://api.vercel.app/blog', {  next: { tags: ['posts'] },})// Page B: /dashboardconstrecentPosts=awaitfetch('https://api.vercel.app/blog?limit=5', {  next: { tags: ['posts'] },})

After callingrevalidatePath('/blog'):

  • Page A (/blog): Shows fresh data (page re-rendered)
  • Page B (/dashboard): Still shows stale data (cache tag 'posts' not invalidated)

Learn about the difference betweenrevalidateTag andupdateTag.

Building revalidation utilities

revalidatePath andupdateTag are complementary primitives that are often used together in utility functions to ensure comprehensive data consistency across your application:

'use server'import { revalidatePath, updateTag }from'next/cache'exportasyncfunctionupdatePost() {awaitupdatePostInDatabase()revalidatePath('/blog')// Refresh the blog pageupdateTag('posts')// Refresh all pages using 'posts' tag}

This pattern ensures that both the specific page and any other pages using the same data remain consistent.

Examples

Revalidating a specific URL

import { revalidatePath }from'next/cache'revalidatePath('/blog/post-1')

This will invalidate one specific URL for revalidation on the next page visit.

Revalidating a Page path

import { revalidatePath }from'next/cache'revalidatePath('/blog/[slug]','page')// or with route groupsrevalidatePath('/(main)/blog/[slug]','page')

This will invalidate any URL that matches the providedpage file for revalidation on the next page visit. This willnot invalidate pages beneath the specific page. For example,/blog/[slug] won't invalidate/blog/[slug]/[author].

Revalidating a Layout path

import { revalidatePath }from'next/cache'revalidatePath('/blog/[slug]','layout')// or with route groupsrevalidatePath('/(main)/post/[slug]','layout')

This will invalidate any URL that matches the providedlayout file for revalidation on the next page visit. This will cause pages beneath with the same layout to be invalidated and revalidated on the next visit. For example, in the above case,/blog/[slug]/[another] would also be invalidated and revalidated on the next visit.

Revalidating all data

import { revalidatePath }from'next/cache'revalidatePath('/','layout')

This will purge the Client-side Router Cache, and invalidate the Data Cache for revalidation on the next page visit.

Server Function

app/actions.ts
'use server'import { revalidatePath }from'next/cache'exportdefaultasyncfunctionsubmit() {awaitsubmitForm()revalidatePath('/')}

Route Handler

app/api/revalidate/route.ts
import { revalidatePath }from'next/cache'importtype { NextRequest }from'next/server'exportasyncfunctionGET(request:NextRequest) {constpath=request.nextUrl.searchParams.get('path')if (path) {revalidatePath(path)returnResponse.json({ revalidated:true, now:Date.now() })  }returnResponse.json({    revalidated:false,    now:Date.now(),    message:'Missing path to revalidate',  })}

Was this helpful?

supported.

[8]ページ先頭

©2009-2025 Movatter.jp