인프런 커뮤니티 질문&답변

디버깅 해본 결과

url 파라미터의 값이 찍히는 걸로 확인했습니다!

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

Next.js에서 URL에 대해 질문 주셨군요. URL에 쿼리 스트링과 경로 파라미터가 포함된 경우, Next.js가 이를 어떻게 처리하는지 설명드리겠습니다.

URL 파라미터와 쿼리 스트링

• URL 파라미터: 동적 라우트로 설정된 부분이며, Next.js에서는 [id].tsx 와 같은 형식으로 정의됩니다. URL 경로의 일부로 인식됩니다. 예를 들어, /book/10 에서 id 는 경로 파라미터로 사용됩니다.

• 쿼리 스트링: URL 경로 끝에 추가적으로 구성된 파라미터이며, 일반적으로 ?key=value 형태를 갖습니다. 예를 들어, ?id=test 는 쿼리 스트링입니다.

결과

/book/10?id=test 이렇게 URL을 요청하면,
- router.query.id는 쿼리 스트링에서 id= “test” 라고 인식합니다.
- router.query 객체에서는 경로 파라미터(10)도 id로 나타날 수 있습니다.

그러므로, 같은 이름의 파라미터가 경로와 쿼리에 모두 존재할 경우, 쿼리 스트링이 우선하여 적용됩니다. 이는 쿼리 파라미터가 종종 특정한 요청 맥락에서 더 중요한 정보를 제공하기 때문입니다.

참고 자료

관련 질문에 대한 추가적인 설명을 다루고 있는 링크가 있습니다:
- 안녕하세요, 5.3)풀라우트 캐시 3. 동적경로에 적용하기 질문

질문에 대한 답변이 도움이 되었길 바랍니다. 혹시 더 궁금한 점이 있으시다면 언제든지 추가 질문해 주세요. 지식공유자께서도 곧 답변해 주실 것입니다.

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