엘리스 SW 엔지니어 트랙(게시글 페이지네이션 기능, 최근 댓글 질문 조회 안되는 문제)

ChanghyeonO·2023년 7월 23일
0

분명 api들이 제대로 동작하는 것을 확인했는데 후에 클라이언트단에서 사용할 때 페이지네이션 기능이 먹통되는 문제와 최근 댓글 질문 조회가 안되는 문제가 발생했다.
어디서 문제가 발생했는지 몰라 서비스코드부터 컨트롤러코드까지 하나하나 다시 뜯어보고 콘솔로 찍어보면서 문제 파악에 나섰는데, 당장 서비스 코드부터 컨트롤러 코드에서는 문제를 발견할 수 없었다.
(이때까지는 라우터에 문제가 있을거라곤 생각도 못했다...)
분명 데이터는 잘 받아와지고 있는데, 포스트맨에서도 뒤늦게 테스트 해보니 페이지네이션 기능이 동작하지 않은 상태로 데이터를 받아오는 걸 확인했다.

아무리 찾아봐도 서비스코드와 컨트롤러 코드 문제는 아니다 싶어서 혹시나 하는 마음에 라우터 코드를 찾아봤다. 그냥 보기엔 어디서 문제가 발생하는지 몰라 라우터 코드만 긁어서 GPT한테 한번 물어봤는데, 아뿔싸,,,
Express가 라우트를 등록한 순서대로 처리하기 때문에, 라우트 순서도 중요하다고 했다.
특히 경로 파라미터가 포함된 라우트 같은 경우에는 이와 비슷한 경로를 가진 라우트보다 뒤에 위치해야 한다고 한다.

import { Router } from "express";
import questionController from "../controller/questionController";
import authAccess from "../middlewares/authAccess";

const questionRouter = Router();

// 질문 생성
questionRouter.post(
  "/questions",
  authAccess,
  questionController.createQuestion,
);

// 로그인된 사용자가 작성한 모든 질문 조회
questionRouter.get(
  "/questions/user",
  authAccess,
  questionController.readUserQuestions,
);

//질문 검색
questionRouter.get(
  "/questions/search",
  questionController.searchQuestionsByKeyword,
);

//모든 질문 조회
questionRouter.get("/questions-all", questionController.readAllQuestions);

// 모든 질문 조회(정렬기능)
questionRouter.get("/questions", questionController.readAllQuestionsWithSort);


// 좋아요가 많은 게시글을 최신순으로 5개만 가지고 오기
questionRouter.get(
  "/questions/most-liked",
  questionController.readMostLikedLatestQuestions,
);

// 댓글이 없는 가장 오래된 질문들 조회
questionRouter.get(
  "/questions/no-comments",
  questionController.readOldestQuestionsWithNoComments,
);

// 특정 질문 조회
questionRouter.get("/questions/:id", questionController.readQuestion);

// 가장 최근에 댓글이 달린 질문 조회
questionRouter.get(
  "/questions/latest-commented",
  questionController.readLatestCommentedQuestion,
);

// 질문 수정
questionRouter.patch(
  "/questions/:id",
  authAccess,
  questionController.updateQuestion,
);

// 질문 삭제
questionRouter.delete(
  "/questions/:id",
  authAccess,
  questionController.deleteQuestion,
);

// 특정 질문에 좋아요 추가 혹은 취소
questionRouter.patch(
  "/questions/like/:questionId",
  authAccess,
  questionController.toggleLike,
);

export default questionRouter;

위 코드는 기존 작성되어 있던 코드.

import { Router } from "express";
import questionController from "../controller/questionController";
import authAccess from "../middlewares/authAccess";

const questionRouter = Router();

// 질문 생성
questionRouter.post(
  "/questions",
  authAccess,
  questionController.createQuestion,
);

// 로그인된 사용자가 작성한 모든 질문 조회
questionRouter.get(
  "/questions/user",
  authAccess,
  questionController.readUserQuestions,
);

// 모든 질문 조회(정렬기능)
questionRouter.get("/questions", questionController.readAllQuestionsWithSort);

//모든 질문 조회
questionRouter.get("/questions-all", questionController.readAllQuestions);

// 좋아요가 많은 게시글을 최신순으로 5개만 가지고 오기
questionRouter.get(
  "/questions/most-liked",
  questionController.readMostLikedLatestQuestions,
);

// 댓글이 없는 가장 오래된 질문들 조회
questionRouter.get(
  "/questions/no-comments",
  questionController.readOldestQuestionsWithNoComments,
);

// 가장 최근에 댓글이 달린 질문 조회
questionRouter.get(
  "/questions/latest-commented",
  questionController.readLatestCommentedQuestion,
);

// 특정 질문 조회
questionRouter.get("/questions/:id", questionController.readQuestion);

// 질문 수정
questionRouter.patch(
  "/questions/:id",
  authAccess,
  questionController.updateQuestion,
);

// 질문 삭제
questionRouter.delete(
  "/questions/:id",
  authAccess,
  questionController.deleteQuestion,
);

// 특정 질문에 좋아요 추가 혹은 취소
questionRouter.patch(
  "/questions/:questionId/like",
  authAccess,
  questionController.toggleLike,
);

export default questionRouter;

위 코드는 수정한 코드다.
위처럼 라우트 위치를 수정해주니 다시 정상적으로 데이터가 불러와지기 시작했다.

가장 기본적일 수 있는 라우트 배치 규칙에 대해서 놓치고 있었다는게 너무 부끄럽지만, 이제라도 알았으니 됐다....
다음에는 이런 실수는 하지말자.

profile
꾸준한 기록을 통해, 좋은 개발자가 되겠습니다.

0개의 댓글