코멘트 삭제

등록된 코멘트와 답글을 삭제하는 기능을 구현하기 위해 필요한 요청 데이터 식별자와 응답 결과 구조를 안내합니다.

데이타 식별자

{
  "dataID": "DELETE_COMMENT",
  "post_key": "E477FEEB837326JEUDYFC505D20C022",
  "comment_key": "A1B2C3D4E5F6837326JEUDYFC505D20C"
}
KeyDescription
dataID코멘트와 답글 삭제 모두 DELETE_COMMENT를 사용합니다.
post_key코멘트가 속한 게시물의 고유 키로 id가 post인 영역의 data-post-key 값에서 자동으로 채워집니다.
comment_key삭제할 코멘트의 고유 키로 삭제 버튼이 속한 h-div-comment 또는 h-div-reply-comment 영역의 data-comment-key 값에서 자동으로 채워집니다.

HTML

<div id="post" data-post-key="E477FEEB837326JEUDYFC505D20C022">
    <div class="h-div-comment" data-comment-key="A1B2C3D4E5F6...">
        <p>Comment content is displayed here.</p>
        <a href="#" class="h-btn-reply-delete">DELETE</a>

        <div class="h-div-reply-comment-list" style="display:none;">
            <div class="h-div-reply-comment" data-comment-key="F6E5D4C3B2A1...">
                <p>Reply content is displayed here.</p>
                <a href="#" class="h-btn-reply-delete">DELETE</a>
            </div>
        </div>
    </div>
</div>
  • div
    <div id="post" data-post-key="E477FEEB837326JEUDYFC505D20C022"></div>

    게시물 영역으로 id는 post로 필수 설정해야 하며 data-post-key에 Response Result의 post[0].post_key 값이 필수로 지정되어야 합니다.

  • div
    <div class="h-div-comment" data-comment-key="A1B2C3D4E5F6..."></div>

    코멘트 한 건이 표시되는 영역으로 class 선택자에 h-div-comment가 필수로 포함되어야 하며 data-comment-key에 해당 코멘트의 comment_key 값이 필수로 지정되어야 합니다.

  • a
    <a href="#" class="h-btn-reply-delete"></a>

    코멘트 삭제 버튼으로 class 선택자에 h-btn-reply-delete가 필수로 포함되어야 하며 h-div-comment 영역 안에 위치해야 합니다. 게시물 삭제 버튼(h-btn-delete)과는 다른 선택자입니다.

  • div
    <div class="h-div-reply-comment" data-comment-key="F6E5D4C3B2A1..."></div>

    답글 한 건이 표시되는 영역으로 class 선택자에 h-div-reply-comment가 필수로 포함되어야 하며 data-comment-key에 해당 답글의 comment_key 값이 필수로 지정되어야 합니다.

  • a
    <a href="#" class="h-btn-reply-delete"></a>

    답글 삭제 버튼으로 코멘트와 동일하게 h-btn-reply-delete를 사용하며 h-div-reply-comment 영역 안에 위치해야 합니다.

Response Result

{
  "result": true,
  "comment_key": "A1B2C3D4E5F6837326JEUDYFC505D20C",
  "comment_count": 12,
  "comment_count_formatted": "12"
}
KeyDescription
result코멘트 삭제 성공 여부
comment_key삭제된 코멘트 고유 키
comment_count삭제 후 남은 코멘트 수
comment_count_formatted천 단위 구분 기호가 적용된 코멘트 수
  • 삭제 버튼 클릭시 확인창이 표시되며 확인하면 삭제 후 코멘트 목록을 자동으로 다시 조회하여 화면에 반영합니다.
  • 본인이 작성한 코멘트만 삭제할 수 있으며 다른 회원의 코멘트를 삭제 요청하면 result가 false로 반환됩니다.
  • 삭제된 코멘트는 delete_flg 값이 Y로 변경되어 목록에서 제외되며 데이터 자체는 보존됩니다.

Example

micky 05-30 02:53

Comment content is displayed here.

<div id="post" :data-post-key="output.post[0].post_key">
  <div class="h-div-comment" :data-comment-key="comment.comment_key"
       v-for="comment in output.post[0].comment_list" :key="comment.comment_key">
    <div class="border-bottom px-1 py-3">
      <div class="d-flex justify-content-between align-items-center">
        <strong class="me-1">{{ comment.name }}</strong>
        <small class="text-secondary">{{ comment.create_date }}</small>
      </div>
      <p class="my-2 py-2 mb-0" v-html="comment.comment.split('\n').join('<br>')"></p>
      <div class="text-end">
        <a href="#" class="h-btn-reply-delete rounded-3 py-2 px-3 bg-gray-light ms-2 small"
           v-if="output.user.auth_flg && comment.member_seq == output.user.seq">
          <i class="fas fa-trash"></i> Delete
        </a>
      </div>
    </div>

    <div class="h-div-reply-comment-list px-2 ms-4 py-3" style="display:none;">
      <div class="h-div-reply-comment" :data-comment-key="reply_comment.comment_key"
           v-for="reply_comment in comment.reply_comment" :key="reply_comment.comment_key">
        <span class="text-primary">@{{ reply_comment.to_name }}</span>
        <span v-html="reply_comment.comment.split('\n').join('<br>')"></span>
        <div class="text-end">
          <a href="#" class="h-btn-reply-delete rounded-3 py-2 px-2 border bg-white ms-2 small"
             v-if="output.user.auth_flg && reply_comment.member_seq == output.user.seq">
            <i class="fas fa-trash"></i> Delete
          </a>
        </div>
      </div>
    </div>
  </div>
</div>
<div id="post" data-post-key="<?= $output['post'][0]['post_key']; ?>">
    <? foreach ($output['post'][0]['comment_list'] as $arrComment) { ?>
        <div class="h-div-comment" data-comment-key="<?= $arrComment['comment_key']; ?>">
            <div class="border-bottom px-1 py-3">
                <div class="d-flex justify-content-between align-items-center">
                    <strong class="me-1"><?= $arrComment['name']; ?></strong>
                    <small class="text-secondary"><?= $arrComment['create_date']; ?></small>
                </div>
                <p class="my-2 py-2 mb-0"><?= nl2br($arrComment['comment']); ?></p>
                <div class="text-end">
                    <? if ($output['user']['auth_flg'] && $arrComment['member_seq'] == $output['user']['seq']) { ?>
                        <a href="#" class="h-btn-reply-delete rounded-3 py-2 px-3 bg-gray-light ms-2 small">
                            <i class="fas fa-trash"></i> Delete
                        </a>
                    <? } ?>
                </div>
            </div>

            <div class="h-div-reply-comment-list px-2 ms-4 py-3" style="display:none;">
                <? foreach ($arrComment['reply_comment'] as $arrReplyComment) { ?>
                    <div class="h-div-reply-comment" data-comment-key="<?= $arrReplyComment['comment_key']; ?>">
                        <span class="text-primary">@<?= $arrReplyComment['to_name']; ?></span>
                        <span><?= nl2br($arrReplyComment['comment']); ?></span>
                        <div class="text-end">
                            <? if ($output['user']['auth_flg'] && $arrReplyComment['member_seq'] == $output['user']['seq']) { ?>
                                <a href="#" class="h-btn-reply-delete rounded-3 py-2 px-2 border bg-white ms-2 small">
                                    <i class="fas fa-trash"></i> Delete
                                </a>
                            <? } ?>
                        </div>
                    </div>
                <? } ?>
            </div>
        </div>
    <? } ?>
</div>