본문 바로가기
Projects/SNS프로젝트

[댓글] 댓글 구현하기(1)

by 젊은오리 2022. 2. 7.
728x90

1. 댓글 모델 생성하기

댓글에는 기본적으로 누가 썼는지, 어떤 이미지에 달린 댓글인지, 댓글 내용은 무엇인지에 관한 정보가 필요하다. ManyToOne연관관계를 사용하여 User, Image 테이블을 Eager(Default)전략으로 가져오는 방법을 사용한다. 

 

2. ajax통신을 위해 .js(Client-side) 작성

jsp파일에 id값이 storyCommentInput-이미지번호 인 댓글작성input칸과, storyCommentList-이미지번호 인 댓글포스팅칸이 존재한다고 할때 댓글 내용과 이미지id 값을 json으로 변환한 후 서버에 전송한다. 

 

3. APIController, Service, Repository 구성과 기능구현

이제 Server-side에서 데이터를 받아 처리하는 일만 남았다. 여러 종류의 데이터를 받아올 때 Data transfer object(Dto)를 사용하면 좋다. content와 imageId만을 갖는 CommentDto클래스를 하나 만들어서 사용했다.

json데이터는 @RequestBody으로 받음을 주의하자

apiController

 

사실 Insert할 수 있는 Comment변수들을 다 가져왔기 때문에 댓글을 insert하는 쿼리를 다음과 같이 작성하여 Service측에서 함수를 작성하여 댓글을 실제로 달아보자.

Repository
Service

=============================== 실행 ================================

 

 

실행결과는 에러가 뜨는 것을 확인 할 수 있다. 사실, 쿼리를 실행/수정하는 Modifying작업을 진행할 때는 반환값이 Comment가 아닌 int/void형이 와야한다. 하지만 우리가 Comment를 리턴하지 않으면 나중에 댓글을 삭제할때 id가 필요한데, 이 id값을 찾을 수 없게된다. 따라서 이 경우에는 nativeQuery를 작성하지 않고 Service측에서 직접 댓글객체를 만들어줘야 한다. 이제 Servce를 바꿔보자.

Comment객체를 리턴하기 위해 내가 만든 mySave가 아닌 Jpa의 save를 사용하여 저장하고 리턴한다.

 

다시 댓글을 작성해보면 다음과 같이 잘 출력되는 것을 확인할 수 있다. 

 

 

다만, 가져온 user에서 images를 또 불러오는 것과, 가져온 image에서 likes, user를 쓸데없이 불러오기 때문에 나중에 무한참조를 방지하기 위해 모델객체에 @JsonIgnoreProperties을 사용하여 데이터를 불러오지 않게 해준다. 

 

Server-side에서의 댓글 기능 구현이 완료되었다. 다음 포스팅에서는 화면상에서 댓글이 렌더링되는 과정을 적을 예정이다.

728x90

댓글