※메인 화면
<?php
include "../connect/connect.php";
include "../connect/session.php";
?>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PHP 블로그 만들기</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- //header -->
<main id="main" class="container">
<div class="intro__inner bmStyle">
<picture class="intro__images">
<source srcset="../assets/img/intro01.png, ../assets/img/intro01@2x.png 2x, ../assets/img/intro01@3x.png 3x" />
<img src="../assets/img/intro01.png" alt="소개이미지">
</picture>
<p class="intro__text">
어떤 일이라도 노력하고 즐기면 그 결과는 빛을 바란다고 생각합니다.
신입의 열정과 도전정신을 깊숙히 새기며 배움에 있어 겸손함을
유지하며 세부적인 곳까지 파고드는 개발자가 되겠습니다.
</p>
</div>
</main>
<!-- //main -->
</body>
</html>
main에 필요한 정보를 가져와 실행 해주거나 직접 입력하였습니다.
<?php
include "../connect/connect.php";
include "../connect/session.php";
?>
- 맨 처음에 있는 이것은 sql에 에있는 회원 정보 와 php 세션을 시작하는 함수 가져오고 있습니다.
connect.php
<?php
$host = "localhost";
$user = "root";
$pw = "root";
$db = "phpClass";
$connect = new mysqli($host, $user, $pw, $db);
$connect -> set_charset("utf-8");
?>
- sql의 에 접속을 해 그곳에 있는 회원의 정보를 가져오고 있습니다.
session.php
<?php
session_start();
?>
- 세션을 시작하는 함수 입니다.
- 웹 애플리케이션에서 사용자 상태를 추적하거나 데이터를 저장하기 위해 세션을 사용합니다
- 이 함수로 인해 로그인을 하면 회원의 값을 가져오거나 로그인이 된 상태 인지를 알수있게 해줍니다.
<?php include "../include/head.php" ?>를 사용해서 head.php 에있는 정보를 가져옵니다.
head.php
<!-- CSS -->
<link rel="stylesheet" href="../html/assets/css/style.css">
<!-- SCRIPT -->
<script defer src="../html/assets/js/common.js"></script>
- 여기에는 css의 정보와 운영체제의 정보가 있습니다.
헤더 부분과 스킵부분은 창이 바뀌어도 고정으로 나오기 때문에 항상 고정시켜줍니다.
<?php include "../include/skip.php" ?> 과 <?php include "../include/header.php" ?>를 이용해 정보를 가져와 따로 만들어 두었던 스킵과 헤더을 불러옵니다.
skip.php
<div id="skip">
<a href="#header">헤더 영역 바로가기</a>
<a href="#main">컨텐츠 영역 바로가기</a>
<a href="#footer">푸터 영역 바로가기</a>
</div>
<!-- //skip -->
- 탭을 눌렀을때 각 영역으로 바로갈수 있는 기능을 넣어 놓았습니다.
header.php
<header id="header">
<div class="header__inner container">
<div class="left">
<a href="../index.html" class="star">
<span class="blind">메인으로</span>
</a>
</div>
<h1 class="logo">
<a href="../main/main.php">Developer Blog</a>
</h1>
<div class="right">
<!-- 로그인이 된 경우 -->
<?php
if(isset($_SESSION['memberID'])){ ?>
<ul>
<li><a href="../mypage/mypage.php"><?=$_SESSION['youName'] ?>님 환영합니다.</a></li>
<li><a href="../login/logout.php">로그아웃</a></li>
</ul>
<?php } else { ?>
<ul>
<li><a href="../join/join.php">회원가입</a></li>
</ul>
<?php } ?>
<!-- 로그인이 안된 경우 -->
</div>
</div>
<nav class="nav__inner">
<ul>
<li><a href="../join/join.php">회원가입</a></li>
<li><a href="../login/login.php">로그인</a></li>
<li><a href="#">게시판</a></li>
<li><a href="#">블로그</a></li>
</ul>
</nav>
</header>
<!-- //header -->
- 사이트 맨위에 있는 창으로 로고와 회원가입, 네비등의 역활을 하고있습니다.
- if(isset($_SESSION['memberID']))를 사용해 만약 있다면 헤더 옆에 이름을 넣어 환엽합니다를 붙여주어 로그인인 상태와 로그아웃 알려줍니다. 만약 없다면 회원가입 창을 보여줍니다.
logout.php
<?php
include "../connect/session.php";
unset ($_SESSION['memberID']);
unset ($_SESSION['youEmail']);
unset ($_SESSION['youName']);
Header("Location: ../main/main.php");
?>
- 로그 아웃을 하는 곳이며 unset 을 사용하여 회원을 값을 삭제 하여 로그아웃을 진행 합니다.
※회원가입
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>회원가입 페이지</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- //header -->
<main id="main" class="container">
<div class="intro__inner center bmStyle">
<picture class="intro__images">
<source srcset="../assets/img/join01.png, ../assets/img/join01@2x.png 2x, ../assets/img/join01@3x.png 3x" />
<img src="../assets/img/join01.png" alt="회원가입 이미지">
</picture>
<p class="intro__text">
회원가입을 해주시면 다양한 정보를 자유롭게 볼 수 있습니다.
</p>
</div>
<!-- intro__inner -->
<div class="join__inner">
<h2>회원가입</h2>
<div class="join__form">
<form action="joinSave.php" name="join" method="post">
<fieldset>
<legend class="blind">회원가입</legend>
<div>
<label for="youEmail" class="required">이메일</label>
<input type="text" id="youEmail" class="inputStyle" name= "youEmail" placeholder="이메일을 적어주세요!" required>
</div>
<div>
<label for="youName" class="required">이름</label>
<input type="text" id="youName" class="inputStyle" name= "youName" placeholder="이름을 적어주세요!" required>
</div>
<div>
<label for="youPass" class="required">비밀번호</label>
<input type="password" id="youPass" class="inputStyle" name= "youPass" placeholder="비밀번호를 적어주세요!" required>
</div>
<div>
<label for="youPassC" class="required">비밀번호 확인</label>
<input type="password" id="youPassC" class="inputStyle" name= "youPassC" placeholder="비밀번호를 한번 더 적어주세요!" required>
</div>
<div>
<label for="youPhone" class="required">연락처</label>
<input type="text" id="youPhone" class="inputStyle" name= "youPhone" placeholder="연락처를 적어주세요!" required>
</div>
<button type="submit" class="btnStyle" >회원가입완료</button>
</fieldset>
</form>
</div>
</div>
</main>
<!-- //main -->
</body>
</html>
- 회원 가입에 필요한 정보를 입력하는 곳 입니다.
- 정보를 다 입력하고 회원 가입 완료 버튼을 누르면 joinSave.php가 실행 되며 정보가 제대로 입력이 되었는지 확인을 해줍니다.
joinSave.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>회원가입 완료페이지</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- //header -->
<main id="main" class="container">
<div class="intro__inner center bmStyle">
<picture class="intro__images">
<source srcset="../assets/img/joinEnd01.png, ../assets/img/joinEnd01@2x.png 2x, ../assets/img/joinEnd01@3x.png 3x" />
<img src="../assets/img/joinEnd01.png" alt="회원가입 이미지">
</picture>
<?php
include "../connect/connect.php";
$youEmail = $_POST['youEmail'];
$youName = $_POST['youName'];
$youPass = $_POST['youPass'];
$youPassC = $_POST['youPassC'];
$youPhone = $_POST['youPhone'];
$regTime = time();
// echo $youEmail, $youName, $youPass, $youPhone;
//메세지 출력
function msg($alert){
echo "<p class='intro__text'>$alert</p>";
}
// 유효성
// //이메일 유효성 검사
$check_mail = preg_match("/^[a-z0-9_+.-]+@([a-z0-9-]+\.)+[a-z0-9]{2,4}$/", $youEmail);
if($check_mail == false){
msg("이메일이 잘못되었습니다. 다시 한번 확인해 주세요!");
exit;
}
// //이름 유효성 검사
$check_name = preg_match("/^[가-힣]{9,15}$/", $youName);
if($check_name == false){
msg("이름은 한글만 가능합니다. 또는 3~5 글자만 가능합니다.");
exit;
}
// //비밀번호 유효성 검사
if($youPass !== $youPassC){
msg("비밀번호가 일치 하지 않습니다. 다시 한번 확인 해주세요");
exit;
}
// $youPass = sha1($youPass); //테드방식
//휴대폰 번호 유효성 검사
$check_number = preg_match("/^(010|011|016|017|018|019)-[0-9]{3,4}-[0-9]{4}$/", $youPhone);
if($check_number == false){
msg("번호가 정확하지 않습니다. 올바른 번호(000-0000-0000) 형식으로 작성 해주세요!");
exit;
}
//이메일 중복 검사
$isEmailCheck = false;
$sql = "SELECT youEmail FROM members WHERE youEmail = '$youEmail'";
$result = $connect -> query($sql);
if($result){
$count = $result -> num_rows;
if($count == 0){
$isEmailCheck = true;
} else {
msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
exit;
}
} else {
msg("에러발생1: 관리자에게 문의하세요!");
exit;
}
//핸드폰 중복 검사
$isPhoneCheck = false;
$sql = "SELECT youPhone FROM members WHERE youPhone = '$youPhone'";
$result = $connect -> query($sql);
if($result){
$count = $result -> num_rows;
if($count == 0){
$isPhoneCheck = true;
} else {
msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
exit;
}
} else {
msg("에러발생2: 관리자에게 문의하세요!");
exit;
}
//회원가입
if($isEmailCheck == true && $isPhoneCheck == true){
// 데이터 입력하기
$sql ="INSERT INTO members(youEmail, youName, youPass, youPhone, regTime) VALUES('$youEmail', '$youName', '$youPass', ' $youPhone', '$regTime')";
$connect -> query($sql);
if($result){
msg("회원가입을 축하합니다! 로그인 해주세요!<br><div class='intro__btn'><a href='../login/login.php'>로그인</a></div>");
exit;
} else {
msg("에러발생3: 관리자에게 문의하세요!");
exit;
}
} else {
msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
exit;
}
// 사용자가 데이터 입력 ---> 유효성 검사(o) ---> 통과 --> 회원가입(쿼리문 정송)
// 사용자가 데이터 입력 ---> 유효성 검사(o) ---> 통과(이메일주소/핸드폰 ) --> 통과 --> 회원가입(쿼리문 정송)
// 사용자가 데이터 입력 ---> 유효성 검사(x) ---> 통과 --> 회원가입(쿼리문 정송)
?>
<a href="#">메인으로</a>
</div>
<!-- intro__inner -->
</main>
<!-- //main -->
</body>
</html>
- 정보가 제대로 입력 되었는지 확인하는 곳입니다
$youEmail = $_POST['youEmail'];
$youName = $_POST['youName'];
$youPass = $_POST['youPass'];
$youPassC = $_POST['youPassC'];
$youPhone = $_POST['youPhone'];
$regTime = time();
- 회원 가입에서 입력한 값을 가져오고 있습니다.
//메세지 출력
function msg($alert){
echo "<p class='intro__text'>$alert</p>";
}
// 유효성
// //이메일 유효성 검사
$check_mail = preg_match("/^[a-z0-9_+.-]+@([a-z0-9-]+\.)+[a-z0-9]{2,4}$/", $youEmail);
if($check_mail == false){
msg("이메일이 잘못되었습니다. 다시 한번 확인해 주세요!");
exit;
}
// //이름 유효성 검사
$check_name = preg_match("/^[가-힣]{9,15}$/", $youName);
if($check_name == false){
msg("이름은 한글만 가능합니다. 또는 3~5 글자만 가능합니다.");
exit;
}
// //비밀번호 유효성 검사
if($youPass !== $youPassC){
msg("비밀번호가 일치 하지 않습니다. 다시 한번 확인 해주세요");
exit;
}
// $youPass = sha1($youPass); //테드방식
//휴대폰 번호 유효성 검사
$check_number = preg_match("/^(010|011|016|017|018|019)-[0-9]{3,4}-[0-9]{4}$/", $youPhone);
if($check_number == false){
msg("번호가 정확하지 않습니다. 올바른 번호(000-0000-0000) 형식으로 작성 해주세요!");
exit;
}
//이메일 중복 검사
$isEmailCheck = false;
$sql = "SELECT youEmail FROM members WHERE youEmail = '$youEmail'";
$result = $connect -> query($sql);
if($result){
$count = $result -> num_rows;
if($count == 0){
$isEmailCheck = true;
} else {
msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
exit;
}
} else {
msg("에러발생1: 관리자에게 문의하세요!");
exit;
}
//핸드폰 중복 검사
$isPhoneCheck = false;
$sql = "SELECT youPhone FROM members WHERE youPhone = '$youPhone'";
$result = $connect -> query($sql);
if($result){
$count = $result -> num_rows;
if($count == 0){
$isPhoneCheck = true;
} else {
msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
exit;
}
} else {
msg("에러발생2: 관리자에게 문의하세요!");
exit;
}
- preg_match() 함수를 사용하여 회원가입의 정보를 규정에 맞게 입력 하였는지 확인하고 그값이 틀렸다면 틀린부분을 알려 주고, exit를 통해 다음 정보의 검사를 멈추게 됩니다.
- 핸드폰과 이메일의 중복 사용을 막기위해 중복확인을 합니다.
- 우선 회원정보가 들어있는 sql에 핸드폰과 이메일을 찾아볼 수 있게 $sql을 이용해 sql의 검색조건을 저장해 주었습니다.
- 그후 그값을 sql의 정보가 저장 되어 있는 $connect 에 query()을 이용하여 실행을 해준 값을 $result로 저장 하여 줍니다.
- 그 다음 조건문으로 $result 를 실행 했을때 num_rows로 인하여 값이 있다면 반환된 값 마다 숫자로 가져오고 만약 없다면 0을 가져 옵니다 그값을 $count에 저장합니다.
- 그렇게 $count가 0일때는 true가 나와서 회원가입이 가능한 상태가 되고, 0이 아닐때는 이미 만들어진 이메일과 폰 번호이기에 로그인을 해달라고 메세지를 주고 있습니다. 그외에 에러는 관리자에게 문의 하라고 하고 있습니다.
※로그인
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>로그인 페이지</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- //header -->
<main id="main" class="container">
<div class="login__inner">
<h2>로그인</h2>
<p>로그인을 하시면 게시글 및 댓글 작성이 가능합니다.<br>회원가입을 하면 로그인이 가능합니다.<br>admin@admin.com/1234</p>
<div class="login___form btStyle bmStyle">
<form action="loginSave.php" name="loginSave" method="post">
<fieldset>
<legend class="blind">로그인 영역</legend>
<div>
<label for="youEmail" class="blind required"></label>
<input type="email" id="youEmail" class="inputStyle" name= "youEmail" placeholder="이메일" required>
</div>
<div>
<label for="youPass" class="blind required"></label>
<input type="password" id="youPass" class="inputStyle" name= "youPass" placeholder="비밀번호" required>
</div>
<button type="submit" class="btnStyle2 mt20">로그인</button>
</fieldset>
</form>
</div>
<div class="login_footer">
<ul class="listStyle">
<li>회원가입을 하지 않았다면 회원가입을 먼저 해주세요! <a href="join.html">회원가입</a></li>
<li>아이디가 기억나지 않는다면! <a href="#">아이디 찾기</a></li>
<li>비밀번호가 기억나지 않는다면! <a href="#">비밀번호 찾기</a></li>
</ul>
</div>
</div>
</main>
<!-- //main -->
</body>
</html>
- 로그인을 하는 창입니다. 로그인에 필요한 정보를 입력한후 로그인 버튼을 클릭하면 loginSave.php 가 실행 되며 그곳에서 정보가 제대로 입력 되었는지 확인 합니다.
loginSave.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PHP 블로그 만들기</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- //header -->
<main id="main" class="container">
<div class="intro__inner center bmStyle">
<picture class="intro__images">
<source srcset="../assets/img/joinEnd01.png, ../assets/img/joinEnd01@2x.png 2x, ../assets/img/joinEnd01@3x.png 3x" />
<img src="../assets/img/joinEnd01.png" alt="회원가입 이미지">
</picture>
<?php
include "../connect/connect.php";
include "../connect/session.php";
$youEmail = $_POST['youEmail'];
$youPass = $_POST['youPass'];
// echo $youEmail, $youPass;
//데이터출력
function msg($alert){
echo "<p class='intro__text'>$alert</p>";
}
// 데이터 조회
$sql = "SELECT memberID, youEmail, youName, youPass FROM members WHERE youEmail = '$youEmail' AND youPass = '$youPass'";
$result = $connect -> query($sql);
if($result){
$count = $result -> num_rows;
if($count == 0){
msg("이메일 또는 비밀번호가 틀렸습니다. 다시 한번 확인해주세요!<br><div class='intro__btn'><a href='../login/login.php'>로그인</a></div>");
} else {
//로그인 성공
$memberInfo = $result -> fetch_array(MYSQLI_ASSOC);
//세션 생성
$_SESSION['memberID'] = $memberInfo['memberID'];
$_SESSION['youEmail'] = $memberInfo['youEmail'];
$_SESSION['youName'] = $memberInfo['youName'];
// echo "<pre>";
// var_dump($memberInfo);
// echo "</pre>";
Header("Location: ../main/main.php");
}
}
?>
</div>
<!-- //intro__inner -->
</main>
<!-- //main -->
</body>
</html>
- 회원 가입 때와 마찬 가지로 사용자의 입력값을 가져와 sql에 그값이 있는지 확인을 하여 있고 없음을 확인 한후 없을경우에는 메세지를 보내고 있을 경우에는 로그인이 성공 되며 $memberInfo 에 $result를 실행하여 나온 유저의 값을fetch_array(MYSQLI_ASSOC)을 통해 배열로 가져와 $_SESSION로 세션을 생성하여 사용자의 정보를 가져옵니다.
- 그후 Header("Location: ../main/main.php")를 통해 값의 정보를 수정한후 main 페이지로 넘어가게 해줍니다.
(로그인을 계속 유지하게 하기위해선 위에서 말했던 session_start() 가 필요합니다.)
session_start() | -PHP에서 세션을 시작하는 함수입니다. -세션은 웹사이트의 사용자와 서버간의 정보 교환을 유지하기 위한 메커니즘입니다. 예를 들어, 로그인 세션을 사용하면 사용자가 로그인한 후에도 웹사이트를 계속 사용할 수 있습니다. |
unset | PHP에서 변수나 배열 등의 값을 삭제하는 함수입니다. |
preg_match() | - PHP에서 제공하는 정규표현식 함수 중 하나로, 문자열이 정규표현식과 일치하는지를 검사합니다. - 정규표현식과 검사할 문자열을 매개변수로 받으며, 일치하는 문자열이 있으면 1을 반환하고, 일치하는 문자열이 없으면 0을 반환합니다. |
exit | PHP에서 스크립트의 실행을 중지하고, 현재까지의 출력을 전송하는 함수입니다 |
query | MySQLi 객체의 메서드 중 하나로, MySQL 데이터베이스에서 SQL 쿼리를 실행합니다. |
num_rows | MySQLi 객체의 메서드 중 하나로, SELECT 쿼리에 대한 결과 집합에서 반환된 행(row)의 수를 반환합니다. |
fetch_array(MYSQLI_ASSOC) | MySQLi_result 객체에서 호출하는 메서드 중 하나로, 결과 집합에서 다음 행(row)을 배열로 반환합니다. |
Header("Location: ") | PHP에서 제공하는 함수 중 하나로, HTTP 헤더(header)를 수정하여 브라우저를 다른 페이지로 이동시킵니다. |