[루비온레일즈] 유저-댓글 (댓글 삭제 기능 구현하기)
이전 포스팅에서 유저와 댓글 모델을 연결하고 댓글 작성 기능을 구현했습니다.
오늘 포스팅에서는 작성자만 댓글을 삭제할 수 있도록 만들겠습니다.
댓글을 삭제하는 기능을 만들기 위해서 할 일은 아래와 같습니다.
1. 뷰 파일에 destroy 버튼 만들기
2. comment 컨트롤러의 destroy 액션 만들기
3. 로그인 여부와 현재 유저 id에 따라 검증하기
이렇게 하면 로그인한 작성자만 댓글을 삭제할 수 있습니다.
1. 뷰 파일에 Destroy 버튼 만들기
제가 만들어놓은 뷰 파일은 comment의 partial/_comment.html.erb입니다. 따라서, _comment.html.erb에 destroy 버튼을 만들어줍니다.
<%= link_to 'Destroy', board_comment_path, method: :delete %>
서버를 열어 버튼이 잘 생성되었는지 확인해보겠습니다.
게시물의 show를 클릭했더니, 에러가 발생했습니다.
에러 내용은 board_id가 필요한데 이게 url에 없다는 것입니다.
그래서 url을 board_comment_path(@board)로 수정했습니다. 괄호 안에 @board를 넣으면 user_id 를 넣어줄 수 있는데 그 이유는 comments 컨트롤러에서 set_board로 @board는 파람스에서 id 값을 찾는 것으로 지정해주었기 때문입니다.
그래서 @board를 가져다 사용할 수 있습니다.
다시 웹사이트를 새로고침해보면 댓글 옆에 Destroy 버튼이 잘 생성된 것을 볼 수 있습니다.
그리고 이 버튼을 누르면 오른쪽과 같은 에러가 발생하는데, 이는 아직 destroy 액션을 만들지 않았기 때문에 발생하는 오류입니다. 여기까지 잘 만들어졌다고 볼 수 있습니다.
2. comments_controller.rb 에 destroy 액션 만들기
계속해서 comments 컨트롤러에 destroy 액션을 만들겠습니다.
그리고 작동하는지 테스트해보겠습니다.
에러가 발생했습니다. 그 내용은 comment의 15라는 id 값을 모르고 있는데 이 15는 board의 id 입니다.
에러가 발생한 지점은 버튼 클릭 후 destroy 액션으로 넘어오는 지점이기 때문에 이 과정에서 board_id 를 찾지 못하고 있습니다. 따라서 뷰 파일에 board_id를 명시적으로 지정해주어야 합니다.
(여기서 꽤 헤맸는데 오류의 지점을 명확히 파악하지 못해서 계속 destroy 액션만 수정했음..)
id 값 명시적으로 지정하기
board_comment_path(@board) 에서 @board로만 보내주면 board_id 를 찾지 못하기 때문에 괄호 안에 id 값을 명시적으로 지정하겠습니다.
아래와 같이 id: comment.id, board_id: comment.board.id) 라고 입력해주면 id는 comment의 id 이고, board_id는 comment가 속한 board의 id 라는 뜻입니다.
이제 다시 테스트를 해보겠습니다. "안녕"이라고 댓글을 새로 작성 후 삭제했더니 잘 동작하는 것을 볼 수 있습니다!! 👍👍
3. 비로그인 시 삭제 버튼 보이지 않게 만들기
그런데 지금 상태는 비로그인 시에도, 댓글 작성자가 아닌 유저도 댓글을 삭제할 수 있는 상태입니다.
우선 비로그인 시에 삭제 버튼을 숨겨서 삭제하지 못하도록 만들겠습니다.
댓글이 보이는 폼인 _comment.html.erb에서 if..end와 user_signed_in?을 활용해 로그인 상태를 검증해줍니다.
로그인 여부에 따라 Destroy 버튼이 보이는지 아닌지 확인해보겠습니다. 비로그인(왼쪽 이미지)에서는 Destroy 버튼이 보이지 않지만, 로그인한 상태(오른쪽 이미지)에서는 Destroy 버튼이 잘 나옵니다.
4. 댓글 작성자만 삭제 가능하도록 만들기
이제 남은 것은 댓글 작성자만 삭제 가능하도록 하는 것입니다.
이렇게 하려면, destroy 액션에서 해당 댓글이 가지고 있는 유저의 아이디와 현재 유저 아이디가 일치하는지 검증하면 됩니다.
이제 서버를 열어 확인해보겠습니다. ingyu@naver.com 으로 로그인해서 댓글을 작성했습니다. 그리고 로그아웃 후 ingyu2@naver.com 로 로그인 해서 지우려고 했더니 동작하지 않습니다!
반대로 테스트 해봐도 잘 동작합니다! 두 가지 경우 모두 새로고침은 되지만, destroy 되지 않습니다!
그리고 해당 댓글의 작성자는 그 댓글을 삭제할 수 있습니다!
이렇게 오늘 유저와 댓글이 연결된 상황에서 댓글 삭제하는 기능을 구현했습니다.
정리하면,
1. 비로그인 상태에서는 Destroy 버튼이 보이지 않습니다. 로그인 상태에서는 버튼이 보입니다.
2. 해당 댓글의 작성자만 그 댓글을 삭제할 수 있습니다.
3. 작성자가 아닌 유저가 삭제를 시도하면 단순히 새로고침만 됩니다.
이제 다음 포스팅에서 댓글 수정 기능을 만들어 유저-댓글 연결을 마무리 지어보겠습니다!
