강의

멘토링

커뮤니티

Inflearn コミュニティ Q&A

hwniieo8040 のプロフィール画像
hwniieo8040

投稿した質問数

TypeScriptで学ぶNext.js 16+ 完全攻略:基礎から最新アーキテクチャまで

データキャッシュ - 3 (revalidatePath + サーバーアクション)

revalidatePath 질문 있습니다.

作成

·

17

·

編集済み

0

revalidatePath("/about", "page") 로 설정을 하고 테스트를 하다 보면 /about 페이지에서 재검증 버튼을 누르면 AboutLayout의 데이터 패칭 결과와 AboutPage의 데이터 패칭 결과가 함께 바뀌는 것과, /about/detail 페이지에서 재검증 버튼을 누르면 아무런 변화도 없는 이유가 revalidatePath의 첫 번째 인자로 설정된 "/about" 이 아닌 /about/detail 페이지에 접속해 있기 때문이라는 것까지는 이해했습니다.

하지만 detail 페이지에서 재검증을 누르고 about 페이지로 이동하면 즉시 AboutPage의 결과는 변하는데 AboutLayout의 결과는 변하지 않는데 이유가 뭔가요?

javascriptreacttypescriptnext.jsjwt

回答 1

0

안녕하세요, 인프런 AI 인턴입니다. hwnii님.

Next.js에서 revalidatePath 함수는 특정 경로(예: /about)의 정적 페이지 데이터를 재검증하고 새로고침하는 역할을 합니다. 해당 경로에서만 작동하는 것이기 때문에 /about/detail 페이지에서는 /about에 설정된 revalidatePath가 영향을 미치지 않는 것이죠.

주요 원인을 간단히 설명드리자면:

  1. 경로의 명확성:

    • revalidatePath("/about", "page")는 명시적으로 /about 경로의 페이지 데이터를 재검증하게 됩니다. 따라서 /about/detail 경로로는 적용되지 않습니다.
    • 각 경로는 별도로 설정해줘야 하며, 레이아웃이 동일하더라도 경로 단위로 작업이 진행됩니다.
  2. 재검증 범위:

    • /about/about/detail는 서로 다른 경로로 간주되며, 재검증 역시 독립적으로 진행됩니다. 따라서 /about/detail에서의 조치는 /about에 영향을 주지 않습니다.
  3. 즉시 반영:

    • /about/detail에서 재검증 버튼을 눌렀을 때 바로 변화가 없는 이유는 /about과는 다른 경로이기 때문입니다. 이후 /about 경로로 이동할 때만 /about의 변경사항이 반영됩니다.

이 부분이 도움이 되실 수 있는 추가 자료입니다:
- Next.js 경로 기반의 ISR(Incremental Static Regeneration) 작동 원리와 사례

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

hwniieo8040 のプロフィール画像
hwniieo8040

投稿した質問数

質問する