프로젝트(영화 평점사이트)

6. 댓글 쓰기, 조회 구현

MY_STUDY 2023. 9. 18. 09:21

오늘은 영화의 상세 페이지에 댓글 쓰기와 조회를 구현할 예정이다. db 테이블을 다음과 같이 구성한다

 

 

VO를 만들고, Mapper를 만든다.

 

 

쿼리문을 다음과 같이 작성한다. 영화의 모든 댓글을 조회하는 select문은 그 영화의 고유 넘버에 저장된 댓글들을 불러오므로 moiveNo을 이용하여 조회하고, 최종적으로 업데이트 된 코멘트를 내림차순으로 보여주기 위해 ORDER BY 구문을 이용한다.

 

댓글 쓰기는 해당 영화의 고유 넘버 역시 작성시켜 이 댓글이 어느 영화의 댓글인지 저장하게 하고, 댓글의 내용이랑 날짜들 역시 저장한다. 유저아이디는 아직 로그인쪽과 연동을 하지 않았기 때문에 '임시'로 저장되게끔 하였다.

 

 

 

댓글을 GET하는 컨트롤러에는 해당 영화의 고유 넘버를 카테고리 형식으로 불러와서 그 영화 넘버에 해당하는 모든 댓글들을 조회하게끔 하고, 그 데이터들을 자바스크립트에 전송한다.

 

댓글을 POST하는 컨트롤러는 작성한 댓글 내용들을 불러와서 저장한다.

 

 

 

자바스크립트로 와서 일단 필요한 요소들을 불러오고, 이제 곧 만들 댓글을 조회하는 함수를 실행시키고, 댓글 등록 버튼을 누를 시 댓글을 쓰는 함수를 실행시키게끔 한다.

 

 

 

댓글 작성 함수, 작성한 내용들을 JSON 데이터로 변환 후 요청에 실어서 POST요청을 하게끔 한다. 그리고 정규 표현식을 이용해 댓글 내용에 공백밖에 없을 경우 이 함수는 실행되지 않게 한다. 함수를 실행한 후 모든 댓글을 조회하게끔 함수를 불러오게 하였다.

 

 

 

그리고 위에서 요청 보낸 데이터들을 컨트롤러 GET에서 받게 하고 그것을 해당 영화의 고유 넘버로 불러온다. 주소에 inputMovieNo가 보이는데, 이것은 html에서 input hidden으로 해당 영화의 고유 넘버를 .value로 불러온 것이다.

 

댓글 부분의 모든 내용들을 지운 뒤, 모든 데이터들을 for문으로 조회 후, 불러온 데이터들을 html에 나타나게 하였다.

 

 

 

 

공백으로 만 댓글을 써보았다. 댓글이 입력되지 않는다.

 

 

 

공백을 주고 댓글을 써 보았다. 댓글이 입력되는 것을 확인할 수 있다.