Web Programming >> PHP Programming
|
[목차] |
제16장 회원 인증 프로그램(MySQL)
1. MySQL을 이용한 회원 인증 프로그램
여러싸이트를 돌아다니다 보면 사용자 가입을 하고, 로그인을 해야 그 사이트의 모든 정보를 볼 수 있는 곳이 많습니다. 또한 유료 사용자와 무료사용자를 구분하여 유료 사용자에게만 필수 정보를 제공하는 사이트도 많습니다. 이러한 사이트의 회원 가입과 로그인은 어떻게 이루어지는지 알아보도록 하고, 그러한 회원 이증 프로그램을 공부해 보도록 하겠습니다. 대개 이러한 사이트는 쿠키라는 인증 방식을 사용합니다. 쿠키란 간단히 설명하면 인터넷 사이트의 방문 기록이나 방문 자의 정보를 남겨 인터넷 사이트와 클라이언트간의 정보를 매개해주는 정보를 뜻합니다. 즉, 인터넷 사이트의 방문 기록이나 방문자의 정보를 남겨 인터넷 사이트와 클라이언트의 정보를 매개해주는 정보. 쿠키정보는 클라이언트 컴퓨터에 그내용이 저장되며, 다시 해당 사이트를 찾았을 때 저장되어 있는 쿠키 데이터를 가지고 다시 인증과 여러 절차를 거치지 않고 빠르게 접속할 수 있도록 도와 줍니다. 이러한 쿠키는 클라이언트 측에 정보가 저장되므로 여러 사용자가 이용하는 사이트에서는 보안상에 문제점이 있습니다. 여러사람이 사용하는 컴퓨터에서 저장되어 있는 쿠키값은 사용자의 정보를 유출할 수 있기 때문입니다. 이에 인터넷 익스플로러 5.0부터는 쿠키 거부 기능이 추가되어 있습니다. 먼저 이러한 쿠키를 사용하여 회원 인증 프로그램을 만들어보도록 하겟습니다. 1. 회원 테이블(member) 만들기
create table member ( level은 해당 사용자가 운영자인지, 일반 사용자인지를 체크하기 위하여 만들어진 필드입니다. level필드를 적절히 사용하면, 유료 사용자와 무료 사용자 등을 구분할 수도 있습니다. 여기서는 일반사용자는 1이고, 관리자는 2의 level를 갖게 설정한다. 위에서는 관리자 아이디를 기본적으로 추가하는 SQL문이 있다. 이 관리자 아이디로, 회원관리를 하면 된다.
2. 처리 흐름도
BBS의 모든 웹문서들은 기본적으로 /bbs/디렉토리 밑에서 작업을 한다.
3. 회원 가입(registerform.html, register.html, check_id.html) id를 입력하고, 아이디 중복 확인 버튼을 클릭하면, 중복 체크가 됩니다.
아이디 중복확인을 하고, 가입신청 버튼을 클릭하면, 아래와 같이 가입 확인 확인 화면이 나타난다.
회원 가입 폼(registerform.html) <HTML> <HEAD> <TITLE>LeeLAB - 회원 가입</TITLE> <SCRIPT LANGUAGE='JavaScript'> function form_submit() { if(!document.registerform.name.value) { alert('이름을 입력하여 주세요.'); document.registerform.name.focus(); } else if(!document.registerform.id.value) { alert('아이디를 입력하여 주세요.'); document.registerform.id.focus(); } else if(!document.registerform.passwd.value) { alert('비밀번호를 입력하여 주세요.'); document.registerform.passwd.focus(); } else if(!document.registerform.passwd1.value) { alert('비밀번호를 확인하여 주세요.'); document.registerform.passwd1.focus(); } else if(document.registerform.passwd1.value != document.registerform.passwd.value) { alert('비밀번호 확인에 실패하였습니다. 다시 입력하여 주세요.'); document.registerform.passwd.value = ''; document.registerform.passwd1.value = ''; document.registerform.passwd.focus(); } else { document.registerform.submit(); } }
function idchk() { if(!document.registerform.id.value) { alert('아이디를 입력하여 주세요.'); document.registerform.id.focus(); } else { tmp = 'check_id.html?id='+document.registerform.id.value; window.open(tmp,'IDCHK','width=300,height=150,scrollbars=no'); } }
</SCRIPT> </HEAD> <BODY> <CENTER> <FONT SIZE=6 FACE='Comic Sans MS'>[ 회원 가입 ]</FONT><BR>
<FORM METHOD=POST ACTION=register.html NAME=registerform> <TABLE border cellpadding=3 cellspacing=0 bordercolor=#545F81 width=400> <TR BGCOLOR=white> <TD ALIGN=CENTER WIDTH=100 bgcolor=#B3BBCD><FONT SIZE=2>이 름</FONT></TD> <TD WIDTH=300><FONT SIZE=2><INPUT TYPE=TEXT NAME=name SIZE=15 MAXLENGTH=8></TD> </TR> <TR BGCOLOR=white> <TD ALIGN=CENTER bgcolor=#B3BBCD><FONT SIZE=2>아이디</FONT></TD> <TD><FONT SIZE=2><INPUT TYPE=TEXT NAME=id SIZE=15 MAXLENGTH=8> <INPUT TYPE=BUTTON VALUE='아이디 중복 확인' onclick='idchk();'></TD> </TR> <TR BGCOLOR=white> <TD ALIGN=CENTER bgcolor=#B3BBCD><FONT SIZE=2>비밀번호</FONT></TD> <TD><FONT SIZE=2><INPUT TYPE=PASSWORD NAME=passwd SIZE=15 MAXLENGTH=8></TD> </TR> <TR BGCOLOR=white> <TD ALIGN=CENTER bgcolor=#B3BBCD><FONT SIZE=2>비밀번호확인</FONT></TD> <TD><FONT SIZE=2><INPUT TYPE=PASSWORD NAME=passwd1 SIZE=15 MAXLENGTH=8></TD> </TR> <TR BGCOLOR=white> <TD ALIGN=CENTER bgcolor=#B3BBCD><FONT SIZE=2>E-Mail</FONT></TD> <TD><FONT SIZE=2><INPUT TYPE=TEXT NAME=email SIZE=40 MAXLENGTH=50></TD> </TR>
</TABLE><br> <TABLE WIDTH=400> <TR> <TD ALIGN=CENTER><INPUT TYPE=BUTTON VALUE='가입신청' onclick='form_submit();'> <input type=button value='뒤로가기' onclick='history.back()'></TD> </TR> </TABLE> </FORM>
아이디 중복 처리 프로그램(check_id.html) <html> <head> <title>Lee LAB - 아이디 중복 체크</title> <meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<style type="text/css"> <!-- a:link,a:visited,a:active { text-decoration : none; } a:hover { text-decoration : underline; color : red; } TABLE, TD, TR, TH { font-size : 10pt; } //--> </style>
<script language="javascript"> <!-- function replace_id() { opener.document.registerform.id.select(); self.close(); } //--> </script> </head>
<body bgColor="lightyellow">
<? ########## 데이터베이스 서버에 연결한다. ########## $dbconn = mysql_connect("localhost","php","php99") or die("DB서버 연결에 실패하였습니다!");
########## 작업 데이터베이스로 sample을 선택한다. ########## $status = mysql_select_db("sample",$dbconn); if(!$status) { $errNO = mysql_errno($dbconn); $errMSG = mysql_error($dbconn);
echo("서버의 sample 데이터베이스연결에 실패하였습니다!<br>"); echo("에러코드 $errNO : $errMSG<br>"); exit; }
$result = mysql_query("SELECT count(id) FROM member WHERE id = '$id'"); if (!$result) { error("QUERY_ERROR"); exit; } $rows = mysql_result($result,0,0); if ($rows || $rows1) { ?> <form> <table width="230" border="0" cellspacing="5" align="center"> <tr> <td align="center"> 신청하신 아이디는 <br><font color="red">이미 등록</font>되어 있습니다! <p> <b>다른 아이디로 신청</b>하여 주십시오. </td> </tr> <tr> <td align="center"> <font size=2> <input type="button" onClick="replace_id()" value="닫기"> </font> </td> </tr> </table> </form> <? } else { ?> <form> <table width="230" border="0" cellspacing="5" align="center"> <tr> <td align="center"> 신청하신 아이디는<br> 등록되어 있지 않으므로 <br><font color="red">사용가능</font>합니다. </td> </tr> <tr> <td align="center" align="center"> <font size=2> <input type="button" onClick="self.close()" value="이 아이디로 신청합니다."> </font> </td> </tr> </table> </form> <? } ?>
</body> </html>
회원 가입 처리 프로그램(register.html) <? ########## 데이터베이스 서버에 연결한다. ########## $dbconn = mysql_connect("localhost","php","php99") or die("DB서버 연결에 실패하였습니다!");
########## 작업 데이터베이스로 sample을 선택한다. ########## $status = mysql_select_db("sample",$dbconn); if(!$status) { $errNO = mysql_errno($dbconn); $errMSG = mysql_error($dbconn);
echo("서버의 sample 데이터베이스연결에 실패하였습니다!<br>"); echo("에러코드 $errNO : $errMSG<br>"); exit; }
if($id && $name) { $query = "SELECT * FROM member WHERE id='$id'"; $result = mysql_query($query); if($row = mysql_fetch_row($result)) { echo "<SCRIPT>alert('이미 사용중인 아이디 입니다.');history.go(-1);</SCRIPT>"; exit; }
$query = "INSERT INTO member (name,id,passwd,email,level) VALUES ('$name','$id','$passwd','$email',1)"; mysql_query($query); echo " <CENTER> <FONT SIZE=6 FACE='Comic Sans MS'>[ 회원 가입 확인]</FONT><BR>
<TABLE border cellpadding=5 cellspacing=0 bordercolor=#545F81 width=400> <TR BGCOLOR=white> <TD ALIGN=CENTER WIDTH=100 bgcolor=#B3BBCD><FONT SIZE=2>이 름</FONT></TD> <TD WIDTH=300><FONT SIZE=2>$name</TD> </TR> <TR BGCOLOR=white> <TD ALIGN=CENTER bgcolor=#B3BBCD><FONT SIZE=2>아이디</FONT></TD> <TD><FONT SIZE=2>$id</TD> </TR> <TR BGCOLOR=white> <TD ALIGN=CENTER bgcolor=#B3BBCD><FONT SIZE=2>E-Mail</FONT></TD> <TD><FONT SIZE=2>$email</TD> </TR>
</TABLE><br> <TABLE WIDTH=400> <TR> <TD ALIGN=CENTER><INPUT TYPE=BUTTON VALUE='확인' onclick='location=\"login.html\";'></TD> </TR> </TABLE>"; } ?>
4. 로그인 화면(login.html)
<HTML> <HEAD> <TITLE> LeeLAB 회원 인증 - 로그인 화면 </TITLE> </HEAD>
<BODY BGCOLOR="#FFFFFF"> <CENTER> <FONT SIZE=6 FACE='Comic Sans MS'>[ 회원 인증 ]</FONT><BR>
<FORM METHOD=POST ACTION=login_process.html NAME=loginform> <TABLE border cellpadding=3 cellspacing=0 bordercolor=#545F81 width=400> <TR BGCOLOR=white> <TD ALIGN=CENTER bgcolor=#B3BBCD><FONT SIZE=2>아이디</FONT></TD> <TD><FONT SIZE=2><INPUT TYPE=TEXT NAME=id SIZE=15 MAXLENGTH=15></TD> </TR> <TR BGCOLOR=white> <TD ALIGN=CENTER bgcolor=#B3BBCD><FONT SIZE=2>비밀번호</FONT></TD> <TD><FONT SIZE=2><INPUT TYPE=PASSWORD NAME=passwd SIZE=15 MAXLENGTH=30></TD> </TR>
</TABLE><br> <TABLE WIDTH=400> <TR> <TD ALIGN=CENTER><INPUT TYPE=submit VALUE='로그인' ></TD> </TR> </TABLE> </FORM>
<center><a href="registerform.html">무료회원가입</a></center>
</BODY> </HTML>
로그인 인증 처리 프로그램(login_process.html) [주의] setcookie()함수 사용시 주의사항 쿠키는 헤더에 먼저 정의되는 정보입니다. 즉, HTML테크의 내용보다 선행해서 설정되어야 합니다. 만약 쿠키 설정을 할 때 HTML을 미리 사용하고 그 아래 쿠키를 설정함녀 에러 메시지가 출력됩니다. 다음은 쿠키의 사용 예를 보여줍니다. 옳은사용 예 : 틀린사용 예 : 오류 메시지 예 : Warning: Cannot add header information - headers already sent by (output started at C:/Apache/Apache/htdocs/bbs/login_process.html:62) in C:/Apache/Apache/htdocs/bbs/login_process.html on line 64위와 같은 오류 메시지가 나타난다면, setcookie()함수 앞에 HTML태가 있는가를 봐야 한다. 위의 예에서는 62번 라인에 태그가 있다는 메시지이다. <? ########## 데이터베이스 서버에 연결한다. ########## $dbconn = mysql_connect("localhost","php","php99") or die("DB서버 연결에 실패하였습니다!");
########## 작업 데이터베이스로 sample을 선택한다. ########## $status = mysql_select_db("sample",$dbconn); if(!$status) { $errNO = mysql_errno($dbconn); $errMSG = mysql_error($dbconn);
echo("서버의 sample 데이터베이스연결에 실패하였습니다!<br>"); echo("에러코드 $errNO : $errMSG<br>"); exit; }
if($id && $passwd) { if(!$id) { echo " <SCRIPT> alert('아이디를 입력하여 주세요.'); history.go(-1); </SCRIPT>"; exit; } else if(!$passwd) { echo " <SCRIPT> alert('비밀번호를 입력하여 주세요.'); history.go(-1); </SCRIPT>"; exit; } else { $query = "SELECT id,name,email,level FROM member WHERE id='$id' AND passwd='$passwd'"; $result = mysql_query($query);
if(!$result) { $errNO = mysql_errno($dbconn); $errMSG = mysql_error($dbconn);
echo("서버의 sample 데이터베이스연결에 실패하였습니다!<br>"); echo("에러코드 $errNO : $errMSG<br>"); exit; }
$total_record = mysql_num_rows($result); if(!$total_record) { echo " <SCRIPT> alert('아이디 또는 암호 오류.'); history.go(-1); </SCRIPT>"; exit; } else { $row = mysql_fetch_object($result);
$my_id = $row->id; $my_name=$row->name; $my_email=$row->email; $my_level=$row->level;
setcookie("user_id",$my_id,0,"/bbs/"); setcookie("user_name",$my_name,0,"/bbs/"); setcookie("user_email",$my_email,0,"/bbs/"); setcookie("user_level",$my_level,0,"/bbs/");
echo " <SCRIPT> alert('로그인 성공.'); location.replace('home.html'); </SCRIPT>"; exit;
}
} } ?>
일반 사용자 계정에서 작업시, URL주소가 http://도메인/~id/형태로 작업된다. 이럴 때는 setcookie()함수의 path부분에, /~id/bbs/형태로 변경해준다. setcookie("user_id",$my_id,0,"/~jklee/bbs/");
5. 로그인 성공시 보여주는 화면 메인 화면(home.html)
<? if(!$user_id || !$user_name) { echo "<SCRIPT>location.replace('login.html');</SCRIPT>"; exit; } ?>
<HTML> <HEAD> <TITLE> 회원만이 볼 수 있는 화면 </TITLE> </HEAD>
<BODY BGCOLOR="#FFFFFF"> <UL> <LI> <A HREF="passwd.html">암호변경</A> <LI> <A HREF="change.html">개인정보변경</A><br>
<LI> <A HREF="admin/">관리자화면</A><br> <LI> <a href="logout.html">종료</a> </UL> </BODY> </HTML>
종료(logout.html) <?
setcookie(user_id,""); setcookie(user_name,""); setcookie(user_email,""); setcookie(user_level,"");
echo "<SCRIPT>location.replace('login.html');</SCRIPT>"; ?>
6. [문제] 암호 변경 프로그램(passwd.html) 직접 작성해 보시기 바랍니다.
<? ########## 데이터베이스 서버에 연결한다. ########## $dbconn = mysql_connect("localhost","php","php99") or die("DB서버 연결에 실패하였습니다!");
########## 작업 데이터베이스로 sample을 선택한다. ########## $status = mysql_select_db("sample",$dbconn); if(!$status) { $errNO = mysql_errno($dbconn); $errMSG = mysql_error($dbconn);
echo("서버의 sample 데이터베이스연결에 실패하였습니다!<br>"); echo("에러코드 $errNO : $errMSG<br>"); exit; }
if(!$user_id || !$user_name) { ?> <SCRIPT LANGUAGE='JavaScript'> <!-- top.location.href="./logout.html"; //--> </SCRIPT> <? exit; }
########## 전달된 변수 $mode의 값이 "form"일 경우 수정양식을 출력한다. ########## if(!strcmp($j,"form")) { ?>
<style type="text/css"> <!-- a:link,a:visited,a:active { text-decoration : none; } a:hover { text-decoration : underline; color : red; } TABLE, TD, TR, TH { font-size : 10pt; } //--> </style>
<script language="javascript"> <!-- function checkIt(form) { if(!IsPW(form.passwd.name)) { alert("비밀번호는 4 ~ 8자의 영문소문자나 숫자 또는 조합된 문자열이어야 합니다!"); form.passwd.focus(); form.passwd.select(); return; } if (form.passwd.value != form.repasswd.value) { alert("입력하신 비밀번호가 일치하지 않습니다.\n다시 확인하시고 입력하여 주십시오."); form.repasswd.focus(); form.repasswd.select(); return; }
form.submit(); }
function IsPW(formname) { var form = eval("document.passwd_form." + formname);
if(form.value.length < 4 || form.value.length > 30) { return false; } for(var i = 0; i < form.value.length; i++) { var chr = form.value.substr(i,1); if((chr < '0' || chr > '9') && (chr < 'a' || chr > 'z') && (chr < 'A' || chr > 'Z')) { return false; } } return true; } //--> </script>
<? $TITLE_BG = "white"; // 각 타이틀에 대한 배경색 $COLUMN_NAME = "#FAFAEE"; // 입력항목 이름에 대한 배경색 $COLUMN_VALUE = "white"; // 입력양식에 대한 배경색
?>
<p> <form name="passwd_form" method="POST" action="./passwd.html?j=process"> <table width="502" border="0" cellspacing="1" cellpadding="0" align="center"> <tr> <td bgColor="#800080"> <table width="500" border="0" cellspacing="1" cellpadding="5" align="center"> <tr> <td width="200" bgColor="<?echo("$COLUMN_NAME")?>" align="center" ><b>현재의 비밀번호</b></td> <td width="300" bgColor="<?echo("$COLUMN_VALUE")?>" align="center"><input type="password" name="current_pw" size="15" maxlength="30"></td> </tr> <tr> <td bgColor="<?echo("$COLUMN_NAME")?>" align="center" ><b>새로운 비밀번호</b></td> <td bgColor="<?echo("$COLUMN_VALUE")?>" align="center"><input type="password" name="passwd" size="15" maxlength="30"></td> </tr> <tr> <td bgColor="<?echo("$COLUMN_NAME")?>" align="center"><b>새로운 비밀번호 [확인]</b></td> <td bgColor="<?echo("$COLUMN_VALUE")?>" align="center"><input type="password" name="repasswd" size="15" maxlength="30"></td> </tr> <tr> <td align="center" colspan="2" bgColor="<?echo("$TITLE_BG")?>"> <font size=2> <input type="button" value=" 비밀번호를 변경합니다" onClick="checkIt(this.form)"> </font> </td> </tr> </table> </td> </tr> </table> </form>
<? } else if(!strcmp($j,"process")) { ########## 해당 회원의 비밀번호를 가져온다. ########## $result = mysql_query("SELECT num FROM member WHERE id = '$user_id' AND passwd='$current_pw'"); if(!$result) { echo " <SCRIPT> alert('QUERY_ERROR'); history.go(-1); </SCRIPT>"; exit; } $rows = mysql_num_rows($result);
if (!$rows) { echo " <SCRIPT> alert('No Access Modify'); history.go(-1); </SCRIPT>"; exit; } else { $result = mysql_query("UPDATE member SET passwd = '$passwd' WHERE id = '$user_id'"); if (!$result) { echo " <SCRIPT> alert('QUERY_ERROR'); history.go(-1); </SCRIPT>"; exit; }
?> <SCRIPT> alert('비밀번호를 수정하였습니다.'); location.replace('home.html'); </SCRIPT> <? } } else { echo " <SCRIPT> location.replace('passwd.html?j=form'); </SCRIPT>";
exit; } ?>
7. [문제] 개인정보 변경 프로그램(change.html) 직접 작성해 보시기 바랍니다.
|
[목차] |