ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [PHP] 게시판 만들기 - 관리자 기능 ①
    프로그래밍/PHP 2020. 9. 25. 23:17

    여태까지의 실습을 통해 게시판에 필요한 대부분의 기능들을 구현해보았습니다. 실습을 끝내려다가, 완성된 게시판을 관리할 수 있는 관리자 기능을 추가하면 좋겠다고 생각하여, 번외로 이번 실습을 진행해볼까합니다.

     

    관리자 계정으로 할 수 있는 기능 요구사항은 다음과 같습니다.

     

    1. 모든 회원의 정보를 수정, 삭제할 수 있다. (DB구조를 모두 엎어야해서 시간관계상 생략 하겠습니다;;)

    2. 모든 게시판 글을 수정, 삭제할 수 있다. 

    3. 모든 댓글을 삭제할 수 있다.

     

     

    먼저 DB 구조를 조금 수정해보도록 하겠습니다.

     

    127.0.0.1/phpmyadmin에 접속한 후 현재 프로젝트에서 사용하고 있는 DB에 들어가 user 테이블을 클릭한 후, SQL 클릭, 아래와 같이 SQL 쿼리를 작성한 후, Ctrl Enter를 눌러줍시다.

     

    alter table [테이블명] add [컬럼명] varchar(100) not null default '[default 저장 값]';
    쿼리 실행 결과

    위의 그림과 같이 role이라는 컬럼이 생성되고, default 값을 USER로 설정했기 때문에, USER가 저장된 것을 확인할 수 있습니다. 저희는 이 속성을 이용하여 일반 사용자는 USER, 관리자는 ADMIN으로 구분할 예정입니다.

     

    다음으로 실습을 통해 만들었던 게시판 로그인페이지로 간 다음 아래와 같이 회원가입을 해줍니다.

     

    회원가입 화면

    회원가입이 완료된 후 다시 phpmyadmin으로 이동합니다. 방금 만들었던 계정의 role이 USER로 세팅된 것을 확인하실 수 있습니다. 이를 수정해줘야합니다. 수정 버튼을 누릅시다.

     

    수정 버튼 눌렀을 때 화면

    그 다음 role 컬럼에 있는 내용을 USER에서 ADMIN으로 변경해주고, 실행 버튼을 눌러주면 방금 만든 계정의 role 컬럼의 값이 변경되는 것을 확인할 수 있습니다. 앞으로 이 계정은 관리자 계정으로 사용하게 됩니다.

     

    이전에 세션을 관리하기 위해서 만들었던 config.php로 이동하여 role에 관련된 세션조건 을 추가해주어야합니다.

     

    <!-- 세션 관리 -->
    <?php
    	session_start();
    	if (isset($_SESSION["userid"])) {
    		$userid = $_SESSION["userid"];
    	}else{
    		$userid = "";
    	}if (isset($_SESSION["username"])){
    		$username = $_SESSION["username"];
    	}else{
    		$username = "";
    	}if (isset($_SESSION["role"])){ // 사용자, 관리자 구분 용도
    		$role = $_SESSION["role"];
    	}else{
    		$role = "";
    	}
    ?>

     

    마지막으로 로그인이 성공했을 때, DB에 있는 정보를 세션에 넣을 수 있도록 작업을 해줘야합니다. 따라서 login_ok.php로 이동하여 해당 작업을 할 수 있도록 코드를 추가합니다.

     

    <?php
        $id   = $_POST['id'];
        $pass = $_POST['pass']; 
        
     $con = mysqli_connect("localhost", "root", "", "bbs");
       $sql = "SELECT * 
       		   FROM user 
               WHERE id='$id'
              ";
    
       $result = mysqli_query($con, $sql);
    
       $num_match = mysqli_num_rows($result);
    
       if(!$num_match) {
         echo("
               <script>
                 window.alert('등록되지 않은 아이디입니다!')
                 location.href = 'login.php';
               </script>
             ");
        } else {
            $row = mysqli_fetch_array($result);
            $db_pass = $row['pass'];
    
            mysqli_close($con);
    		/* 로그인 화면에서 전송된 $pass와 DB의 $db_pass의 해쉬값 비교 */
            if(!password_verify($pass, $db_pass)){
            	echo("
    	              <script>
    	                window.alert('비밀번호가 틀립니다!')
    	                location.href = 'login.php';
    	              </script>
    	           ");
    	           exit;
            }else {
                session_start();
                $_SESSION["userid"] = $row["id"];
                $_SESSION["username"] = $row["name"];
                $_SESSION["role"] = $row["role"]; // 추가 코드        
                echo("
                  <script>
                    location.href = 'index.php';
                  </script>
                ");
            }
         }        
    ?>
    

     

    이렇게 하면 일단 사용자 계정과 관리자 계정으로 로그인 했을 때의 화면을 구분할 수 있습니다. 그러나 위의 main.php의 분기를 다른 코드에서도 똑같이 적용해줘야하는 단점이 존재합니다. 따라서 새로운 파일을 하나 만들어서, 공통되는 네브바의 내용을 넣은 다음 각 코드마다 이를 참조하게끔 코드를 작성하는게 유지보수 측면에서 훨씬 좋은 코드라고 생각됩니다. 

     

    따라서 저는 head.php, header.php를 만들어서 다음과 같이 코드를 분리하고, 이를 main.php에서 참조하도록 만들었습니다.

     

    
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width" initial-scale="1">
    <!-- 스타일 시트 참조 / css폴더의 bootstrap.css 참조 -->
    <title>PHP 게시판 웹 사이트</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    		<link rel="stylesheet" href="css/custom.css">
    				<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
    				<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    

     

    <div class="navbar-header">
    				<!-- Collapse : 제목을 클릭하면 해당내용이 펼쳐지고 다른내용은 접히는 특수 효과 -->
    				<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
    				aria-expanded="false">
    				<span class="icon-bar"></span>
    				<span class="icon-bar"></span>
    				<span class="icon-bar"></span>
    				</button>
    				<a class="navbar-brand" href="main.php">PHP 게시판 웹 사이트</a>
    			</div>   
    			<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
    				<ul class="nav navbar-nav">
    					<li><a href="main.php">메인</a></li> <!-- 바닐라 자바스크립트로 나중에 active 속성 추가 -->
    					<li><a href="list.php">게시판</a></li>
    				</ul>
    			<?php 
    				if(!$userid){
    			?>    
    				<ul class="nav navbar-nav navbar-right">
    					<li class="dropdown">
    						<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" 
    						aria-haspopup="true" aria-expanded="false">접속하기<span class="caret"></span></a>
    						<ul class="dropdown-menu">
    							<li><a href="login.php">로그인</a></li> <!-- 바닐라 자바스크립트로 나중에 active 속성 추가 -->
    							<li><a href="join.php">회원가입</a></li>
    						</ul>
    					</li>
    				</ul>
    			<?php 
    				}else if($userid){	
    					$logged = $username."(".$userid.")";
    			?>
    				<ul class="nav navbar-nav navbar-right">
    					<li class="dropdown">
    						<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" 
    						aria-haspopup="true" aria-expanded="false"><b><?=$logged ?></b>님의 회원관리<span class="caret"></span></a>
    						<ul class="dropdown-menu">
    							<li><a href="logout.php">로그아웃</a></li>
    						</ul>
    					</li>
    				</ul>
    			<?php }?>
    			</div>

     

    <?php
    	include_once "./config.php";
    ?>
    <!DOCTYPE html>
    <html>
    	<head>
    		<?php include_once "./fragments/head.php";?>
    	
    	</head>
    	<body>
    		<!-- 표준 네비게이션 바 (화면 상단에 위치, 화면에 의존하여 확대 및 축소) -->
    		<nav class="navbar navbar-default">
    			<?php include_once "./fragments/header.php";?>
    		</nav>
    		<div class="container">
    			<div class="jumbotron">
    				<div class="container">
    					<h1>웹 사이트 소개</h1>
    					<p>이 웹 사이트는 '서버프로그래밍' 수업의 기말 프로젝트를 위해서 PHP를 이용해 간단하게 구현한 게시판 입니다.</p>
    					<p><a class="btn btn-primary btn-pull" href="list.php" role="button">게시판 바로가기</a></p>
    				
    				</div>
    			</div>
    		</div>
    		<div class="container"> 
        		<div id="carousel-example-generic" class="carousel slide">
                <!-- Indicators(이미지 하단의 동그란것->class="carousel-indicators") -->
                	<ol class="carousel-indicators">
    	              <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
    	              <li data-target="#carousel-example-generic" data-slide-to="1"></li>
    	              <li data-target="#carousel-example-generic" data-slide-to="2"></li>
    	            </ol>
    	            <!-- Carousel items -->
    	            <div class="carousel-inner">
    	            	<div class="item active">
                    		<img src="https://c1.staticflickr.com/5/4320/35952487306_154709a4eb_b.jpg" width="1200" height="400" alt="First slide">
                    	</div>
    	                <div class="item">
    	                   <img src="https://c1.staticflickr.com/5/4324/35605403570_4caa1e57bd_b.jpg" width="1200" height="400" alt="Second slide">               
    	                </div>
    	                <div class="item">
    	                   <img src="https://c1.staticflickr.com/5/4323/35605404720_ed06f4dbae_b.jpg" width="1200" height="400" alt="Third slide">                 
    	                </div>
                 	</div>
                 	<!-- Controls -->
                  	<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
                    	<span class="icon-prev"></span>
                  	</a>
                  	<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
                    	<span class="icon-next"></span>
                  	</a>
              	</div>
      		</div>
      		<!-- JS 코드는 밑에 두는걸 권장 -->
      		<script src="./js/login.js"></script> 
    		<script>
    // 			$(function(){
    // 				 $(".carousel").carousel(){ // 캐러셀 jQuery
    // 					interval: 1000;
    // 				 }); 
    // 			});
    		</script>
    	</body>
    </html>

     

    이런식으로 다른 코드에도 똑같이 적용을 해주시면 됩니다. 이렇게 관리자 계정을 구현하기 위한 세션 설정, 그리고 코드를 조금 리팩토링 해보았습니다. 다음 시간에는 관리자 기능으로 회원관리를 구현하는 시간을 가져보도록 하겠습니다.

     

    PHP 게시판 만들기 시리즈 👇

     

    노력의 천재

    Carpe Diem, Seize the day

    transferhwang.tistory.com

     

    댓글

Designed by Tistory.