📝 View 구현
- 이번 시간에는 게시글에 댓글을 달 수 있도록 구현해보겠습니다.
- 우선 디자인을 먼저 구현해주기 위해 detail.jsp 파일에 다음과 같은 코드를 추가해주었습니다.
- 결과는 다음과 같습니다.
📝 View 테스트
- 이번에는 임의로 댓글 데이터를 삽입한 뒤 해당 데이터가 상세보기 페이지에서 잘 출력되는지 확인해보도록 하겠습니다.
- 먼저 MySQL에서 다음과 같이 임시 데이터를 삽입해주었습니다.
- 이후 detail.jsp 파일을 다음과 같이 수정합니다.
- 다음으로 Board 객체의 무한 참조를 방지하기 위해 Board 클래스로 이동하여 Reply 객체 필드에 다음과 같은 어노테이션을 추가해줍니다.
- @JsonIgnoreProperties 어노테이션은 해당 필드가 Reply 클래스에 구현되어있는 Board 객체를 다시 참조하여 무한 참조되는 것을 막아주는 역할을 수행합니다.(Reply 객체도 Board 객체를, Board 객체도 Reply 객체를 갖고 있으므로 서로 무한 참조가 발생하게 됨)
- 이후 페이지를 실행해보면 임의로 넣어놓은 댓글들이 댓글창에 잘 출력되는 것을 확인할 수 있습니다.
- 추가로 댓글 출력 순서를 오름차순이 아닌 내림차순으로 하고 싶다면 다음과 같은 어노테이션을 활용할 수 있습니다.
📝 댓글 작성
- 이번에는 댓글을 직접 작성하는 기능을 구현해보도록 하겠습니다.
- 우선 detail.jsp 파일을 다음과 같이 수정해줍니다.
- 이어서 board.js 파일에 다음과 같이 코드를 추가해줍니다.
- 이후 BoardService 클래스에 댓글 작성을 위한 함수를 구현해주었습니다.
- 마지막으로 BoardApiController에서 요청을 받아 위 함수를 실행시키도록 구현해주었습니다.
- 이후 테스트를 진행하여 댓글이 작성되어 잘 추가되는지 확인합니다.
📝 댓글 삭제
- 이번에는 댓글 삭제 기능을 구현해보도록 하겠습니다.
- 우선 detail.jsp 파일을 다음과 같이 수정해줍니다.
- 이렇게 하면 댓글 삭제 버튼은 해당 댓글을 작성한 사람에게만 보일 것입니다.
- 다음으로 board.js 파일에 replyDelete 함수를 추가해줍니다.
- 이후 BoardService 함수에 댓글 삭제를 위함 함수를 구현하고
- BoardApiController 클래스에서는 사용자 요청을 받아 위 함수를 사용하여 댓글 삭제를 수행합니다.
- 이후 테스트를 수행하여 기능이 잘 동작하는지 확인합니다.
❗ 추가사항
- 댓글이 작성된 게시글을 삭제하려고 할 시 오류가 발생하는 것을 확인할 수 있는데, 이는 현재 Board 객체와 Reply 객체가 데이터베이스에서 외래키의 관계로 서로 연결되어 있기 때문입니다.
- 따라서 이를 해결하기 위해서는 제약조건 설정을 해주어야 합니다.
- cascade 속성은 Reply 객체에 연결된 Board 객체가 삭제될 때 DB 안에서 Reply 객체의 행방을 결정합니다.
- 즉, 위처럼 CascadeType.REMOVE로 지정할 경우 게시글이 삭제되면 해당 게시글에 작성되었던 모든 댓글들도 함께 삭제될 것입니다.
💡 알게 된 점
- 개체 간 제약조건을 설정하는 방법
📌 Reference
GitHub - Daegwon-Kim/SpringBoot-JPA-Blog
Contribute to Daegwon-Kim/SpringBoot-JPA-Blog development by creating an account on GitHub.
github.com
'🚗 Backend Toy Project > 스프링 부트 게시판' 카테고리의 다른 글
| [스프링부트 게시판] 23. 로그인 실패 예외 처리 (0) | 2022.06.28 |
|---|---|
| [스프링부트 게시판] 22. 개선 및 수정사항 (0) | 2022.06.25 |
| [스프링부트 게시판] 20. 카카오 로그인 (0) | 2022.05.16 |
| [스프링부트 게시판] 19. 회원정보 수정 (0) | 2022.05.15 |
| [스프링부트 게시판] 18. 게시글(추가, 상세보기, 삭제, 수정, 페이징) (0) | 2022.05.14 |