PHP를 이용하여 로그인과 로그아웃 기능을 구현해보자

이전 편에서 회원가입 기능을 구현해 보았다. 이번 편은 회원가입을 이어서 로그인과 로그아웃 기능을 구현하는 예제이며 간단하게 아이디, 비밀번호 그리고 아이디 저장 기능 까지 구현해 보도록 하자

참고로 본 예제는 이전 편에서 회원가입 구현과 연계되니 이전 포스팅을 미리 확인해야 본 예제를 이용하여 기능 구현이 가능하다.

PHP를 이용하여 회원가입 기능을 구현 해보자

본 예제를 이용한 회원가입기능을 테스트하기 위해선 웹 서버가 필요하니 참고바라며 본 예제에서는 이러한 내용들은 포함되지 않았으니 소스코드를 참고하여 웹 서버 지원이 되는 곳에서 테스트를 해보기 바란다. 회원가입 서비스를 구현하기 위해선 여러 기능들이 필요하다. 단 모든 기능들을 예제로 표현하기는 어렵기 때문에 이번 편에서는 단순하게 회원 기본정보만을 이용하···

blog.redinfo.co.kr/post/view?pid=173

1. 로그인 FORM 과 로그아웃 | login.php

<?php // login.php 

	// 세션 시작
	session_start();

	// 아이디 저장이 있을 경우
	if(!isset($_COOKIE['AUTH_ID_CHECK'])){ $_COOKIE['AUTH_ID_CHECK'] = ''; }

	// 로그인 여부에 따른 처리
	$member = false;
	if(isset($_SESSION['member']) && $_SESSION['member'] != ''){
		$member = $_SESSION['member'];
	}
?>

<!-- jquery 사용을 위한 라이브러리 로드 -->
<script src="//code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script> 

<?php if( $member !== false){?>
<div id="mypage">
	<div class="top"><strong><?php echo $member->NAME ?></strong>님 환영합니다.</div>

	<div class="myinfo">
		<ul class="item">
			<li class="title">아이디</li>
			<li class="value"><?php echo $member->ID; ?></li>
		</ul>
		<ul class="item">
			<li class="title">이름</li>
			<li class="value"><?php echo $member->NAME; ?></li>
		</ul>		
		<ul class="item">
			<li class="title">휴대폰 번호</li>
			<li class="value"><?php echo $member->HPP; ?></li>
		</ul>			
		<ul class="item">
			<li class="title">이메일</li>
			<li class="value"><?php echo $member->EMAIL; ?></li>
		</ul>		
		<ul class="item">
			<li class="title">성별</li>
			<li class="value"><?php echo $member->GENDER == 'M' ? '남성':'여성'; ?></li>
		</ul>				
		<ul class="item">
			<li class="title">생년월일</li>
			<li class="value"><?php echo $member->BIRTHDAY; ?></li>
		</ul>		
		<ul class="item">
			<li class="title">가입일</li>
			<li class="value"><?php echo $member->CREATE_DT; ?></li>
		</ul>									
		<ul class="item">
			<li class="title">변경일</li>
			<li class="value"><?php echo $member->MOD_DT; ?></li>
		</ul>											
	</div>

	<div class="logout"><a id="logout" href="#none" onclick="return false;" >로그아웃</a></div>	
</div>
<!-- 로그인 후 style -->
<style>
	#mypage{ width:100%; max-width: 500px; margin:30px auto; }
	#mypage .top{ margin:10px 0; font-size:17px; }
	#mypage ul{ overflow: hidden; }
	#mypage ul li{ float: left; list-style:none; line-height:30px; padding:10px 0; }
	#mypage ul li.title{ width:140px; text-align:center; font-weight:900; background-color:#fafafa; }
	#mypage ul li.value{ margin-left:5px;}	
	#mypage .logout a{ border:solid 1px #eee; background-color:#333; color:#fff; text-decoration:none; padding:5px 3px; width:100%; text-align:center; display:inline-block}
</style>


<!-- 로그아웃 script -->
<script>
var authSubmit = true;
$(document).on('click','#logout',function(){
	if( !confirm("로그아웃 하시겠습니까?") ){ return false; }
	authSubmit = false;
	$.ajax({url:"logout.php", dataType:'json' , type: 'post'})
	.done(function(e){
		if( typeof e.msg !='undefined' && e.msg != '' ){ alert(e.msg); } 
		if( e.rst == 'success'){ window.location.reload(); }
	})
	.always(function(e){
		authSubmit =true;
	})
	.fail(function(e){ alert('오류가 발생하였습니다.'); })
});
</script>

<?php }else{ ?>
<!-- 로그인 폼 html -->
<form id="form-login" name="form-login" method="post" action="login-complete.php" onsubmit="return false;">
	<h1>로그인</h1>
	<ul class="item">
		<li class="title">아이디</li>
		<li class="value">
			<input type="text" name="id" value="<?php echo $_COOKIE['AUTH_ID_CHECK'] != '' ? $_COOKIE['AUTH_ID_CHECK']: null ?>" placeholder="아이디를 입력해주세요.">
		</li>
	</ul>
	<ul class="item">
		<li class="title">비밀번호</li>
		<li class="value">
			<input type="password" name="password" value="" placeholder="비밀번호를 입력해 주세요.">
		</li>
	</ul>	

	<div class="sub-item"><label><input type="checkbox" name="id-check" value="Y"<?php echo $_COOKIE['AUTH_ID_CHECK'] != '' ? ' checked':null ?>> 아이디를 저장합니다.</label></div>
	<div class="submit"><a id="login-submit" href="#none" onclick="return false;">로그인</a></div>
</form>

<!-- 로그인 폼 style -->
<style>
	h1{ text-align:center; }
	input[type="text"]
	,input[type="password"]
	{line-height:30px;}
	input[type="password"]{ width:300px;}
	#form-login{ width:100%; max-width: 500px; margin:30px auto; }
	#form-login ul{ overflow: hidden; }
	#form-login ul li{ float: left; list-style:none; line-height:30px; padding:10px 0; }
	#form-login ul li.title{ width:140px; text-align:center; font-weight:900; background-color:#fafafa; }
	#form-login ul li.value{ margin-left:5px; }
	#form-login .sub-item{ text-align:center; margin:10px 0; }
	#form-login .submit{ text-align:center; }
	#form-login .submit a{ text-decoration: none; background-color:#333; color:#fff; width:100%; max-width:120px; display: inline-block; text-align:center; padding:10px 0; }
</style>

<!-- 로그인 폼 script -->
<script>
var authSubmit = true;
$(document).on('click','#login-submit',function(){
	var $form = $('#form-login');
	var formData = $form.serialize();
	authSubmit = false;
	$.ajax({url:$form.attr('action'), data: formData, dataType:'json' , type: $form.attr('method')})
	.done(function(e){
		if( typeof e.msg !='undefined' && e.msg != '' ){ alert(e.msg); } 
		if( e.rst == 'success'){ window.location.reload(); }
	})
	.always(function(e){
		authSubmit =true;
	})
	.fail(function(e){ alert('오류가 발생하였습니다.'); })
});
</script>

<?php } ?>

2. 로그인 체크 | login-complete.php

입력된 아이디와 비밀번호를 통해 회원여부를 체크하고 로그인 처리를 구현한다.

<?php 

// DB연결설정 <!: 환경에 맞게 수정 필요>
$dbConfig = array(
	'host'=>'localhost', // 호스트
	'username'=>'', // DB USER 이름
	'dbname'=>'', // DB명
	'password'=>'', // DB 비밀번호
);

try{
	$response = array('rst'=>'fail',',msg'=>'응답실패');

	// 입력값 체크 
	if(empty($_POST['id'])){ throw new Exception("아이디를 입력해주세요."); }
	if(empty($_POST['password'])){ throw new Exception("비밀번호를 입력해주세요."); }

	// 입력값 재정의
	$_POST['id']= strtolower($_POST['id']); // 아이디 소문자 변경
	$_POST['password'] = '*'.strtoupper(sha1(sha1($_POST['password'], true)));

	// MYSQLI 접속
	$mysqli = @new mysqli($dbConfig['host'],$dbConfig['username'],$dbConfig['password'],$dbConfig['dbname']);
	if( $mysqli == false){  throw new Exception("사이트 오류가 발생하였습니다.");  }

	// 계정정보 호출
	$query = "SELECT * FROM MEMBER WHERE ID = '".addslashes($_POST['id'])."' ";
	$resultData = new \stdClass;
	if($result = $mysqli->query($query)) {
	    $resultData = $result->fetch_object();
	    $result->close();
	}	
	else{
		throw new Exception("사이트 오류가 발생하였습니다.");
	}
	if( !isset($resultData)){
		// 계정정보가 없다는 메시지는 보안상 좋지 않기 때문에 정확하게 명시해줄 필요가 없다.
		throw new Exception("로그인에 실패하였습니다.");
	}

	// 비밀번호가 틀렸다는 메시지는 보안상 좋지 않기 때문에 정확하게 명시해줄 필요가 없다.
	if( $resultData->PASSWORD != $_POST['password']){ throw new Exception("로그인에 실패하였습니다."); }

	// 아이디 저장 여부에 따른 처리 
	if( !empty($_POST['id-check']) && $_POST['id-check'] == 'Y'){
		setcookie("AUTH_ID_CHECK",$_POST['id'],time()+(86400*364),"/",$_SERVER['HTTP_HOST']); // 1년간 저장
	}
	else{
		setcookie("AUTH_ID_CHECK",'',time()-3600,"/",$_SERVER['HTTP_HOST']); // 쿠키 삭제
	}

	// 로그인 정보를 세션에 저장한다.
	session_start();
	$_SESSION['member'] = $resultData;

	$response['rst'] = 'success';
	$response['msg'] = '';
	$mysqli->close();

}
catch(Exception $e){
	$response['msg'] = "[".$e->getLine()."] ".$e->getMessage();
}

// 결과응답
die(json_encode($response));

3. 로그아웃 기능 구현 | logout.php

로그인후 로그아웃을 할 수 있는 기능을 구현다.

<?php 
	// 세션 시작
	session_start();


	// 로그인 여부에 따른 처리
	$member = false;
	if(isset($_SESSION['member']) && $_SESSION['member'] != ''){
		unset($_SESSION['member']);
		die(json_encode(array('rst'=>'success')));
	}	
	else{
		die(json_encode(array('rst'=>'fail','msg'=>'Access Deny!')));
	}

위와 같이 로그인 기능 및 로그인 후 로그아웃 기능 까지 구현하는 방법에 대해 알아보았다. 다음 편에서는 회원정보를 수정하는 예제에 대해 알아보도록 하자.

그룹 목록

카테고리 연관글

Comment

댓글작성