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

winnaba61님의 프로필 이미지
winnaba61

작성한 질문수

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

05-05-dynamic-routing-board-mutation

404 오류 관련 질문

해결된 질문

작성

·

211

0

05-05-dynamic-routing-board-mutation

스크린샷 2024-04-07 03.51.52.png

05-05-dynamic-routing-board-mutation-moved

스크린샷 2024-04-07 03.51.56.png

 

계속해서 대조해보지만 게시글 등록하기를 누르고 moved 페이지로 넘어갈 때 404 오류가 뜹니다. catch에서 잡히지 않는걸로 보아 데이터 전송에서 문제가 있는건 아니지 않을까 싶은데, 아무리 봐도 해결책이 보이지 않아 질문 남깁니다.

답변 2

0

노원두님의 프로필 이미지
노원두
지식공유자

안녕하세요! winnaba61님!

일반적으로 404 NotFound 라는 에러는 존재하지 않는 경우에 발생하는 에러랍니다!

 

위 코드를 보면, router.push() 를 사용하여 다음의 주소로 이동을 하고 계신 것 같아요!
현재: /05-05-dynamic-routing-board-mutation-moved/[number]

 

하지만, 우리가 기존에 만들었던 주소는 앞에 /section05 가 붙는답니다!
변경후: /section05/05-05-dynamic-routing-board-mutation-moved/[number]

 

주소를 다시 변경하여 시도해 보세요!^^

0

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

404 오류는 서버가 요청받은 리소스를 찾을 수 없다는 것을 의미합니다. winnaba61님의 경우, 게시글 등록 후 moved 페이지로 넘어갈 때 해당 오류가 발생한다고 하셨는데, 이는 주로 다음과 같은 이유로 발생할 수 있습니다.

  1. 라우팅 문제: 애플리케이션의 라우팅 설정에서 해당 경로에 대한 처리가 제대로 되어 있지 않는 경우입니다. Next.js를 사용하고 계실 경우, pages 폴더 아래에 해당하는 경로의 컴포넌트 파일이 있는지 확인해보세요. 예를 들어, moved 경로로 이동하는 경우 pages/moved.js 혹은 pages/moved/index.js가 존재해야 합니다.

  2. 서버 측 라우팅: 만약 백엔드와의 통신 과정에서 리다이렉트 되는 경우, 서버 측에서 해당 경로를 처리할 수 있도록 라우팅 설정이 되어 있는지 확인해 보세요.

  3. Next.js의 동적 라우팅 문제: 동적 라우팅을 사용하는 경우, 파일 또는 폴더 이름을 [param].js 형태로 설정해야 합니다. 만약 moved가 동적 파라미터를 받는 페이지인 경우, pages/[moved].js와 같이 설정되어 있어야 합니다.

해결 방법으로는 먼저, 개발자 도구의 Network 탭에서 어떤 요청이 404 오류를 발생시키는지 확인해보세요. 그 후, 위에서 언급한 라우팅 관련 문제를 중점적으로 점검해보시기 바랍니다.

또한, 서버와의 통신 로직에서 문제가 없는지, 라우팅 대상의 페이지나 API 엔드포인트가 올바르게 구현되어 있는지도 꼼꼼히 확인해보세요.

더 구체적인 도움이 필요하시면, 관련 코드와 함께 다시 질문 남겨주시기 바랍니다.

winnaba61님의 프로필 이미지
winnaba61

작성한 질문수

질문하기