[Spring] @RequestBody 와 @ResponseBody

@RequestBody @ResponseBody 는 XML이나 JSON과 같은 메시지 기반의 커뮤니케이션을 위해 사용된다.

 

@ResponseBody가 메서드 레벨에 부여되면 메서드가 리턴하는 객체는 뷰를 통해 결과를 만들어내는 Model로 사용되는 대신, 메시지 Converter를 통해 바로 HTTP 응답의 메시지 본문으로 전환된다.

 

@RequestBody @ResponseBody를 위한 jackson 라이브러리 필요

<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind -->
<dependency>
    <groupId>com.fasterxml.jackson.core</groupId>
    <artifactId>jackson-databind</artifactId>
    <version>2.14.2</version>
</dependency>

💡 스프링부트에서는 의존성이 자동으로 포함되어 있음.

 

@ResponseBody

Controller에서 응답처리를 JSP로 하지 않고 JSON 형식으로 처리가 가능하다. 즉, 자바클래스를 리턴하면 자동으로 JSON으로 만들어서 반환한다. 주로 자바스크립트 jQuery와 연동하기 위하여 사용

💡 Java 클래스 ➜ JSON

    @RequestMapping(value= {"/yyy"})
    @ResponseBody // LoginDTO -> JSON 으로 변경
    public LoginDTO yyy() {

        LoginDTO dto = new LoginDTO();
        dto.setUserid("옥지");
        dto.setPasswd("1234");
        return dto;
    }

    @RequestMapping(value= {"/zzz"})
    @ResponseBody // ArrayList<LoginDTO> -> JSON 으로 변경
    public ArrayList<LoginDTO> zzz() {

        ArrayList<LoginDTO> list = new ArrayList<LoginDTO>();
        list.add(new LoginDTO("옥지", "1234"));
        list.add(new LoginDTO("빵빵이", "1234"));
        list.add(new LoginDTO("제니", "1234"));
        return list;
    }

main.jsp

<script
    src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        // yyy 이벤트
        $("#yyy").on("click", function() {
            //ajax
            $.ajax({
                url : 'yyy',
                type : "get",
                dataType : "json", // 응답데이터 타입
                success : function(data, status, xhr) {
                    console.log(data);
                    console.log(data.userid);
                    // JSON -> str 로 변경
                    var str = JSON.stringify(data);
                },
                error : function(xhr, status, error) {

                }
            });//end ajax
        })

        // zzz 이벤트
        $("#zzz").on("click", function() {
            //ajax
            $.ajax({
                url : 'zzz',
                type : "get",
                dataType : "json",
                success : function(data, status, xhr) {
                    console.log(data);
                    //배열 반복
                    $.each(data, function(idx, ele) {
                        console.log(ele);
                        console.log(ele.userid);
                    });
                    // JSON -> str 로 변경
                    var str = JSON.stringify(data);
                },
                error : function(xhr, status, error) {

                }
            });//end ajax
        });
    });
</script>

 

@RequestBody

브라우저에서 JSON을 전달하면 Controller에서 자바 클래스로 자동으로 변환한다.

💡 JSON ➜ Java 클래스

    @PostMapping("/yyy")
    public String yyy(@RequestBody LoginDTO dto) {
        System.out.println(dto);
        return "main";
    }

    @PostMapping("/zzz")
    public String zzz(@RequestBody ArrayList<LoginDTO> list) {
        System.out.println(list);
        return "main";
    }

main.jsp

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        // yyy 이벤트
        $("#yyy").on("click", function() {
            $.ajax({
                url : 'yyy',
                type : "post",
                dataType : "text", // 응답 데이터 타입
                headers : {         // 요청 데이터 타입
                    "Content-Type" : "application/json"
                },
                data : JSON.stringify({
                    userid : "gang",
                    passwd : "1234"
                }),
                success : function(data, status, xhr) {

                },
                error : function(xhr, status, error) {

                }
            });
        });

        // zzz 이벤트
        $("#zzz").on("click", function() {
            //ajax
            $.ajax({
                url : 'zzz',
                type : "post",
                dataType : "text", // 응답 데이터 타입
                headers : {        // 요청 데이터 타입
                    "Content-Type" : "application/json"
                },
                data : JSON.stringify([{
                    userid : "옥지",
                    passwd : "1234"
                }, {
                    userid : "빵빵이",
                    passwd : "1234"
                }]),

                success : function(data, status, xhr) {

                },
                error : function(xhr, status, error) {

                }
            });
        });
    });
</script>

 

@RestController

Controller의 모든 메서드가 @ResponseBody를 사용한다면 Controller에다 @RestController을 지정한다. 각각의 메서드에 @ResponseBody를 지정할 필요가 없다. 

💡 @RestController = @Controller + @ResponseBody