개발/KH국비지원과정

[KH국비지원 웹개발자 과정] Day_64 키워드 AJAX, JSON배열, AJAX댓글 실습

mabb 2022. 10. 8. 10:22
반응형

 

해당 포스팅은 강의 복기용으로 키워드를 기록하는 용도의 포스팅입니다.
--------------------------------------------------------------------------------------------------

 

ArrayList의 값을 하나씩 꺼내어 json array에 담아 화면으로 반환하는 실습.
자바의 List를 바로 반환할 수 없기 때문에 json 배열로 변환을 하여 반환하는 것.

자바의 List를 JSON배열로 만드는 방법
방법1. 직접 List의 값들을 꺼내어 JSON배열에 add한다.
방법2. GSON을 이용한다. gson.toJson(리스트)

GSON
리스트를 json으로 변환해주는 라이브러리.
gson을 쓰지 않고 json array를 사용할 때는
json array객체를 만들어서 json객체를 하나하나 add하여 만들었다.
gson은 이 과정을 편리하게 처리할 수 있게 해주는 것이다. 
리스트를 다른 별도의 처리 없이 그대로 jsonarray로 보내줄 경우
return new Gson().toJson(mList); 이 한 줄로 대체가 가능하다.


어레이리스트에서 json으로 바꾸는건 gson
json에서 자바의 객체로 만드는 것은 Jackson

화면에서 json리스트를 출력하는 방법
방법1. 문자열에 누적하여 innerHTML이나 value에 누적된 문자열을 넣는다.

ajax를 이용한 댓글 실습)
jstl 코어태그 및 form태그를 사용하지 않고 ajax로 데이터를 주고받으며 자바스크립트로요소를 동적으로 생성하여 구현하였다. 댓글 리스트를 뽑아주는 함수를 만들고. 댓글 추가, 삭제, 수정 시  변경된 내용 반영 시 댓글 리스트에 누적되지 않도록 하는 것이 포인트였음.
1.
detail 페이지가 로드될 경우 ajax가 실행되어
댓글 리스트를 가져온다

2.
 1)
 댓글 등록 버튼을 누를 경우 ajax가 실행되어
 댓글을 등록한다.
 2)
 댓글 등록 성공 시 ajax가 실행되어 댓글리스트를 가져온다.

변수명 앞에$를 붙이는 것은 아무 차이가 없음. 관습같은 것.

ajax를 함수로 만들어서 쓸것임.
날짜 이상하게 나오는 것도 처리할 예정.

댓글 리스트가 계속 누적되지않도록
리스트를 불러오기 전에 바디를 비워준다.

날짜 바꾸기는 gson을 이용.
Gson gson = new GsonBuilder().setDateFormat("yyyy-MM-dd").create();
return gson.toJson(rList);

자바스크립트를 함수로 만들어서 재사용에 용이하도록 한다.

el태그를 자바스크립트에서도 사용할 수 있다!!!!!!!!!!
"${boardNo}" 처럼 큰따옴표로 가져다 사용할 수 있다.

ajax를 페이지 온로드시 실행되도록 하여 
페이지를 새로고침 한다.

RequestMapping 의 produces 속성에 오타가 있었는지
ajax의 콜백함수가 실행되지 않았다.
보내주는 데이터가 일반 문자열인데 
application/json 으로 설정을 해서 보내는 값자체가 달라진 것으로 보인다.

 

컨트롤러 예외처리 어노테이션

@ExceptionHandler({NullPointerException.class, SQLException.class})
public String errorHandler() {

return "";
}

반응형