[Nextjs] dynamic routing 새로고침시 데이터 소실 에러

지난 번에 마주했던 Nextjs 라우팅 문제는 이제 해결 된 듯 했다. 

관련 에러 포스팅 보러가기 (👉🏻 https://mindevlog.tistory.com/191)

 

또 다른 라우팅 문제가 발견되었다. 정적 라우팅은 cloudFront로 해결을 봤는데, 이번엔 동적 라우팅이 문제였다!😔

어떠한 게시판의 게시물 상세로 들어갈 때 , `/file/[id]` 이런식으로 동적라우팅(dynamic routing) 처리를 하고 있다.

브라우저에서 새로고침(refresh)를 하면, 해당 상세 페이지에 출력되어있던 모든 데이터들이 사라지고, 심지어 html 역시 출력 못하고 기본페이지로 보내버리는 것 아닌가... 

 

방법을 찾아서 AWS cloudfront 함수를 다시 작성도 해보고, lambda를 써야한다 - nextjs 13을 쓰면 사용할 수 있는 method가 있다 등등 다양한 해결책들이 나왔지만 시도해봤을 때 제대로 해결된 건 없었다. 

 

 

그러다 찾은 은인님의 포스팅. 

👉🏻 https://devowen.com/448

[Troubleshooting] Next.js에서 dynamic routing 새로고침 에러

 

앞에 정적 라우팅처럼 고정값의 url을 주고 뒤에 id path를 붙여서 값을 가져오게했다!!!! 

이게 된다!!! 👏🏻👏🏻👏🏻