[스프링, 스프링 부트] Spring - ajax로 호출하는 controller 메서드 구현방법

이번에는 javaScript에서 ajax로 컨트롤러의 메서드를 호출할때 응답을 어떤식으로 하는게 좋을지 알아보자

 

바로 응답 객체를 반환하냐 아니면 ResponseEntity<>로 감싸서 반환하냐 둘중에 뭐가 더 좋을까?

1. 바로 응답 객체를 반환 받는방식

---

예시코드

/**
 * [READ]
 * 각각의 게시글에 달린 대댓글을 리스트로 받아오는 컨트롤러
 * ajax로 호출한다. -> 동작: 댓글 하단의 댓글보기를 클릭하면 이 컨트롤러를 통해 그 댓글의 대댓글 정보를 보여준다.
 */
@ResponseBody
@GetMapping("/get/{boardId}")
public Page<BoardSubCommentResponse> getBoardSubCommentList(
        @PathVariable Long boardId,
        @PageableDefault(size = 10, sort = "createdAt", direction = Sort.Direction.DESC) Pageable pageable
) {
    // 대댓글을 받아서 응답값을 response 객체로 변환한다.
    return boardSubCommentService.getBoardSubCommentList(boardId, pageable)
            .map(BoardSubCommentResponse::fromDto);
}

 

---

 

2. ResponseEntity<>로 한번 감싸서 받는 방식

---

예시코드

/**
 * [READ]
 * 각 게시글별로 달린 대댓글을 리스트로 받아온다.
 * 동작: ajax로 호출하며 댓글 하단에 있는 댓글보기 버튼을 클릭하면 이 컨트롤러로 대댓글을 받아온다.
 */
@ResponseBody
@GetMapping("/ajax/{boardId}")
public ResponseEntity<?> getBoardSubCommentList(
        @PathVariable Long boardId,
        @PageableDefault(size = 10, sort = "createdAt", direction = Sort.Direction.DESC) Pageable pageable
) {
    // 대댓글을 받아서 응답값을 response 객체로 변환한다.
    Page<BoardSubCommentResponse> subCommentResponses = boardSubCommentService.getBoardSubCommentList(boardId, pageable)
            .map(BoardSubCommentResponse::fromDto);

    return new ResponseEntity<>(subCommentResponses, HttpStatus.OK);
}

 

---

 

3. 위의 controller 코드를 호출하는 Ajax 작성방식

---

Ajax 호출 시 응답 처리:

• Ajax 호출의 경우, 클라이언트는 HTTP 응답 본문과 상태 코드를 모두 확인할 수 있다. JavaScript에서 jQuery를 사용하여 Ajax 호출을 하는 경우 다음과 같이 응답을 처리할 수 있다.

$.ajax({
    url: '/get/ajax/' + boardId,
    type: 'GET',
    dataType: 'json',
    success: function(response) {
        // 성공적으로 데이터를 받아왔을 때의 로직 처리
        console.log(response);
    },
    error: function(error) {
        // 에러 발생 시의 로직 처리
        console.error(error.responseJSON.errorMessage);
    }
});

• 위의 success 콜백에서는 정상적으로 데이터를 받아온 경우의 로직을 처리하며, error 콜백에서는 에러 발생 시의 로직을 처리한다.

 

---

 

4. 두 방식중에 어떤것이 더 좋은 방법일까?

---

4-1. Page<BoardSubCommentResponse>(객체) vs ResponseEntity<>(응답 객체로 감싸기)

• Page<BoardSubCommentResponse>:
  • 이 방식은 직접적이고 간단하다. 클라이언트에게 페이지 정보와 함께 결과를 반환한다. HTTP 상태 코드는 기본적으로 200 OK가 된다.
• ResponseEntity<>:
  • 이 방식은 더 유연하다. ResponseEntity<>를 사용하면 응답 본문 외에도 HTTP 상태 코드, 헤더 등을 사용자 정의로 설정할 수 있다.
• 일반적으로, 단순한 경우에는 Page<BoardSubCommentResponse>와 같은 타입을 직접 반환하는 것이 깔끔하고 이해하기 쉬울 수 있다. 그러나 응답에 대한 더 세밀한 제어가 필요한 경우, 예를 들면 다른 상태 코드나 특별한 헤더를 설정해야 하는 경우, ResponseEntity를 사용하는 것이 좋다.
  
  
• 개발할 때는 프로젝트의 요구 사항과 개발 팀의 스타일 가이드에 따라 선택하면 된다.
  
  

4-2. 요즘 트렌드에 따르면 2번에서 어떤방식이 더 선호되는가?

• 최근의 트렌드를 고려하면, API 디자인과 구현에서는 응답의 유연성과 명확성을 강조하고 있다. 이에 따라서 ResponseEntity<>를 사용하는 방식이 더 선호되는 경향이 있다.
  
  
• 여기에는 몇 가지 이유가 있다.
  
  1. 유연성
     • ResponseEntity<>를 사용하면 HTTP 상태 코드, 헤더, 본문을 모두 사용자 정의로 설정할 수 있다. 이는 다양한 상황에서 필요한 응답을 만드는 데 유용하다.
       
       
  2. 명확성
     • API의 응답을 구체적으로 지정하면 클라이언트 개발자가 응답을 더 쉽게 이해하고 사용할 수 있다. ResponseEntity를 사용하면 응답의 구조와 상태 코드를 명확하게 지정할 수 있다.
       
       
  3. 표준 준수
     • RESTful API 디자인 원칙에 따르면, 다양한 상황에서 적절한 HTTP 상태 코드를 반환하는 것이 좋다. ResponseEntity를 사용하면 이러한 원칙을 쉽게 준수할 수 있다.
       
       
  4. 오류 처리
     • ResponseEntity를 사용하면 성공 응답 뿐만 아니라 오류 응답도 명확하게 처리할 수 있다. 예를 들어, 특정 오류 상황에서 사용자 정의 오류 메시지와 함께 특정 상태 코드를 반환할 수 있다.
       
       
• 그러나 이 모든 것이 항상 필요한 것은 아니다. 간단한 API나 프로토타입을 만들 때는 복잡성을 피하기 위해 직접 객체를 반환하는 방식을 선택할 수도 있다.

 

결국 선택은 프로젝트의 요구 사항, 개발 팀의 선호도, 그리고 향후 유지 보수 및 확장성을 고려하여 결정해야 한다.

---

2023.08.16 - [HTTP] - Web개발 기초 - HTTP 구조

Web개발 기초 - HTTP 구조