조회수/좋아요(취소) 기능

서론

오늘은 간단할 줄 알았던 조회수/좋아요(취소포함) 기능을 만들어보자

(간단한 구현은 없었어..😮‍💨)

 

---

 

최종화면

---

1. 조회수 기능 만들기

✅board_read.php

if($user_id != $row['author']){
	$sql_views = "UPDATE board SET  views = views + 1 WHERE idx=$post_id";
	$result_views = $mysqli->query($sql_views);
}

• 조회수 구현은 간단했다. 게시글 읽기 파일에 $user_id=$_SESSION['user_id']로 변수를 할당해줬다
• 로그인한 사용자와 작성자가 같지 않다면, 해당 게시글 views(조회수)를 1증가 시킨다.

1.2. 테스트

➡️현재 ronaldo라는 사용자로 로그인이 되어있다.

➡️자기 글인 ronaldo의 글을 조회하면 조회수가 올라가지 않는다.

➡️다른 작성자인 messi의 글을 조회하니 조회수가 1 올라갔다.

➡️이후에 게시글 안에서도 조회수를 볼 수 있게 추가해줬다.

 

---

3. 좋아요/취소 기능 만들기

3.1. 테이블 생성

• 먼저 post_likes라는 테이블을 만들었다.
• 좋아요 누른 이용자의 게시글번호/유저아이디를 알아내기 위해서 post_id, user_id를 만들었다.

• 좋아요를 중복으로 누를 수 없게 unique key를 추가해줬다.

3.2. board_read.php 

$likes = false;
    if($user_id){
        $like_sql = "SELECT 1 FROM post_likes WHERE post_id=$post_id AND user_id='$user_id' LIMIT 1";
        $like_result = $mysqli->query($like_sql);
        if($like_result && $like_result->fetch_assoc()){
            $likes =true;
        }
    }

• $likes에 기본값은 “좋아요를 누르지 않은 상태”로 false를 할당했다.
• $likes를 이용해 좋아요를 눌렀었는지 안눌렀었는지를 판단해서 로직을 구현할 것이다.
• post_likes테이블에서 해당 게시글($post_id)에 로그인한 사용자($user_id)가 이미 좋아요를 눌렀는지 검사한다.
• limit은 혹시 중복이 있을 시를 방지 하기위해서 넣었다.
• sql구문이 성공하고 행이 존재한다면 $likes를 true로 바꿔준다.
• 즉, 좋아요를 눌렀었다면 $likes는 true가 되는 것이다.

<div class="post_meta">
	작성자: <?=$row['author']?> | 작성일: <?=$row['post_date']?> | 조회수: <?=$row['views']?> 좋아요<?=$row['likes']?>
	<?php if($user_id && $user_id !== $row['author']): ?>
		<span class="like_btn">
		<?php if($likes): ?>
			<form action="/board/unlike.php" method="POST">
 				<input type="hidden" name="post_id" value=<?= $row['idx']?>>
				<button type="submit" class="unlike"><i class="fa-solid fa-heart"></i></button>
			</form>
		<?php else: ?>
			<form action="/board/like.php" method="POST">
				<input type="hidden" name="post_id" value=<?= $row['idx']?>>
				<button type="submit" class="like"><i class="fa-regular fa-heart"></i></button>
			</form>
		<?php endif; ?>
		</span>
	<?php endif; ?>
</div>

• 작성자, 작성일, 조회수를 한 줄로 보여준다.
• 로그인한 사용자이면서 작성자가 아닐 때만 하트 버튼이 노출된다
• $likes가 true(좋아요 누름) → “취소” 버튼(꽉 찬 하트)  →  클릭 시 /board/unlike.php로 post_id를 POST 방식으로 전송
• $likes가 false(좋아요 안 누름) → “좋아요” 버튼(빈 하트)→ 클릭 시 /board/like.php로 post_id를 POST 방식으로 전송
• <input>태그 속성으로 hidden을 줬고, 버튼 클릭 시 해당 게시글 번호(post_id)를 숨겨서 함께 서버로 전달한다.
• FontAwesome 아이콘 사용했다. 아래 링크 참고
  링크:https://fontawesome.com/icons/heart?s=solid

 

3.3. like.php

<?php
    session_start();
    require_once $_SERVER['DOCUMENT_ROOT'].'/php/db.php';

    $post_id = $_POST['post_id'];
    $user_id = $_SESSION['user_id'];

    $sql_check1 = "SELECT author FROM board WHERE idx=$post_id";
    $res_check1 = $mysqli->query($sql_check1);
    $row = $res_check1-> fetch_assoc();

    if($user_id === $row['author']){
        echo "<script>alert('자신의 게시글에는 좋아요를 누를 수 없습니다.');";
        echo "history.back()</script>";
        exit;
    }

    $sql_check2 = "SELECT 1 FROM post_likes WHERE post_id=$post_id and user_id='$user_id' LIMIT 1";
    $res_check2 = $mysqli->query($sql_check2);

    if($res_check2 && $res_check2->fetch_assoc()){
        echo "<script>alert('이미 좋아요를 눌렀습니다.');";
        echo "history.back()</script>";
        exit;
    }

    $sql = "UPDATE board SET likes = likes +1 WHERE idx=$post_id;
    INSERT INTO post_likes (post_id,user_id) VALUES ('$post_id','$user_id');";
    $result = $mysqli->multi_query($sql);

    echo "<script>
            location.href = '/board/board_read.php?idx=$post_id';
        </script>";
        exit;
?>

• 게시글 작성자 본인은 좋아요를 누를 수 없도록 1차 검증한다.
• 이미 좋아요를 누른 사용자는 중복 좋아요가 불가하도록 2차 검증한다.
• 두 조건 다 아니라면
  해당 게시글의 좋아요 수를 1 증가시키고,
  post_likes 테이블에 “누가 어떤 글에 좋아요했는지” 기록을 추가한다.
• 모든 처리가 끝나면 해당 게시글 페이지로 이동한다.

 

3.4. unlike.php

<?php
    session_start();
    require_once $_SERVER['DOCUMENT_ROOT'].'/php/db.php';

    $post_id = $_POST['post_id'];
    $user_id = $_SESSION['user_id'];

    $delete_sql = "DELETE FROM post_likes where post_id=$post_id AND user_id='$user_id' LIMIT 1;
    UPDATE board SET likes = likes-1 WHERE idx=$post_id;";
    $delete_res = $mysqli->multi_query($delete_sql);

    echo "<script>
            location.href = '/board/board_read.php?idx=$post_id';
        </script>";
        exit;
?>

• 현재 로그인한 사용자가 누른 좋아요 기록을 post_likes 테이블에서 삭제한다.
• 해당 게시글의 board 테이블에서 좋아요 수를 1 감소시킨다.
• 해당 게시글 페이지(board_read.php)로 이동한다.
• 사용자에게는 바뀐 좋아요 상태가 즉시 반영된 화면이 보여진다.

---

4. 테스트

➡️좋아요를 누르기 전 빈하트가 보이고 좋아요 수는 0이다.

➡️좋아요를 클릭하면 꽉 찬 하트가 되고, 좋아요 수가 증가한다.

➡️목록에서도 1이 증가한 것을 볼 수 있다.

➡️같은 작성자 글로 들어오면 좋아요는 보이지 않는다.

➡️하지만 클라이언트에서 JS, HTML 변조를 할 수 있기 때문에 php에서도 검증을 했다.

➡️개발자 도구에서 80이던 게시글번호를 자신의 게시글 번호인 74로 바꿔준 뒤 좋아요를 눌렀더니
알림이 뜬 것을 확인할 수 있다.