ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • Spring에서 VO객체 뷰 단(html, thymeleaf, jsp...) 에서 JSON 타입으로 사용하기
    IT/Java 2021. 8. 12. 23:33

    아래와 같이 data1과 data2라는 필드를 가진 VO객체가 있다고 가정하자.

    public class SomeVO {
        private String data1;
        private int data2;
    
        public String getData1() { return data1; }
        public void setData1(String data1) { this.data1 = data1; }
        public int getData2() { return data2; }
        public void setData2(int data2) { this.data2 = data2; }
    }

     

     

    Spring의 Controller에서 ModelAndView 안에 addObject를 이용해 VO객체를 담거나 RestAPI에 VO객체 자체를 반환하고 싶을때 아래와 같이 사용한다.

    //View Mapping Controller인 경우
    @RequestMapping(value = "/testPath")
      public ModelAndView getSomething() {
      ModelAndView mav = new ModelAndView("sample/samplePath");
      mav.addObject("someVO", new SomeVO());
      return mav;
    }
    
    //API인 경우
    @ResponseBody
    @RequestMapping(value = "/testPath")
    public ModelAndView getSomething() {
      return SomeVO.toString();
    }

     

     

     

    그리고 View templete에 맞는 문법으로 해당 데이터를 불러오는 경우 아래와 같은 모양으로 표출된다.

    SomeVO{data1='~~', data2='~~~~'};

    이를 javascript의 Object안에 JSON 형식이든 JS Object 형식이든 저장해두려고 해도 안된다.

    (정확하게는 JSON과 javascript Object는 서로 다른 데이터타입이다. 자세한건 https://victorydntmd.tistory.com/193 를 참고하시고, 여튼...)

     

    그래서 javascript에서 해당 VO객체를 Object화 시키려면 아래와 같은 개노가다 삽질코딩을 해야한다.

    let someData = {
    	data1 : %someData.data1 참조식%
    	,data2 : %someData.data2 참조식%
    };

    데이터가 두개밖에 없어서 별거없어보이지만, VO 객체의 필드가 20개 30개가 되면 토나오는 작업이 아닐 수 없으며, 뭔가 쌩하드코딩의 느낌때문에 굉장히 찝찝한 느낌이 든다.

     

     

     


    VO를 javascript에서 참조 시 SomeVO{~~~} 꼴로 나타나는 이유는, 해당 VO의 toString의 기본값이 저런형태이기 때문이다.

    이를 Javascript에서 깔끔하게 한방에 변수화 시키려면, VO의 @Override toString에서 JSON 타입으로 반환하도록 정의해주면 된다.

        @Override
        public String toString() {
            final StringBuffer sb = new StringBuffer("{");
            sb.append("data1:\"").append(data1).append('"');
            sb.append(", data2:\"").append(data2).append('"');
            sb.append(", data4:\"").append(data4).append('"');
            sb.append(", data5:\"").append(data5).append('"');
            sb.append(", data6:\"").append(data6).append('"');
            sb.append(", data7:\"").append(data7).append('"');
            sb.append('}');
            return sb.toString();
        }

     

    그러면 javascript에서 아래와 같이 바로 객체화 시킬 수 있다

    let someData = %someData 데이터 참조식%;
    //또는
    let someData = JSON.parse(%someData 데이터 참조식%);

     


    이클립스는 잘 모르겠고, Intellij의 경우에는 해당 JSON타입으로 toString을 바로 만들수 있는 방법이 있다.

     

    Command + n을 누르고 toString으로 진입해서 SETTING 클릭

     

    Templetes에서 + 버튼 클릭 후 JSONFormat이라는 이름으로 탬플릿 생성, 이후 아래 포멧 입력

    public java.lang.String toString() {
    final java.lang.StringBuffer sb = new java.lang.StringBuffer("{");
    #set ($i = 0)
    #foreach ($member in $members)
    #if ($i == 0)
    sb.append("##
    #else
    sb.append(", ##
    #end
    #if ($member.string)
    $member.name:\"")##
    #else
    $member.name:")##
    #end
    #if ($member.primitiveArray)
    ;
    if ($member.name == null) ##
    sb.append("null");
    else {
    sb.append('[');
    for (int i = 0; i < $member.name .length; ++i)
    sb.append(i == 0 ? "" : ", ").append($member.name [i]);
    sb.append(']');
    }
    #elseif ($member.objectArray)
    .append($member.name == null ? "null" : java.util.Arrays.asList($member.name).toString());
    #elseif ($member.string)
    .append($member.accessor).append('"');
    #else
    .append($member.accessor);
    #end
    #set ($i = $i + 1)
    #end
    sb.append('}');
    return sb.toString();
    }

    포멧을 Copy -> Paste를 하면 자동으로 들여쓰기가 적용될 수 있는데, 전체 선택 후 Shift + Tab을 눌러주어 들여쓰기를 모두 없애야 한다. 그래야 실제 toString 했을 때 의도치않은 공백이 생기지 않는다.

     

    이후에 새로 만든 JSONFomat 형식으로 toString을 만들면 아래와같이 메소드가 만들어진다.

     

    댓글 0

다치지 말고 운동하자.