Blog만들기 1탄- 회원가입

한번씩 읽고 가세요.

“ 지연되는 프로젝트에 인력을 더 투입하면 오히려 더 늦어진다. ”

- Frederick Philips Brooks
Mythical Man-Month 저자

728x90

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 container 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>
        <!-- join__inner -->
        <div class="join__inner container">
            <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="email" id="youEmail" name="youEmail" class="inputStyle" placeholder="이메일을 적어주세요!" required>
                        </div>
                        <div>
                            <label for="youName" class="required">이름</label>
                            <input type="text" id="youName" name="youName" class="inputStyle" placeholder="이름을 적어주세요!" required>
                        </div>
                        <div>
                            <label for="youPass" class="required">비밀번호</label>
                            <input type="password" id="youPass" name="youPass" class="inputStyle" placeholder="비밀번호를 적어주세요!" required>
                        </div>
                        <div>
                            <label for="youPassC" class="required">비밀번호 확인</label>
                            <input type="password" id="youPassC" name="youPassC" class="inputStyle" placeholder="다시 한번 비밀번호를 적어주세요!" required>
                        </div>
                        <div>
                            <label for="youPhone" class="required">연락처</label>
                            <input type="text" id="youPhone" name="youPhone" class="inputStyle" placeholder="연락처를 적어주세요!" required>
                        </div>
                        <button type="submit" class="btnstyle1">회원가입 완료</button>
                    </fieldset>
                </form>
            </div>
        </div>
    </main>
    <!-- //main -->
</body>
</html>

php로 작업할때는 <?php?>를 사용하여 작업을 많이 한다.

    <?php include "../include/head.php" ?>
</head>
<body class="gray">
    
    <?php include "../include/skip.php" ?>
    <!-- skip -->


    <?php include "../include/header.php" ?>
    <!-- header -->

include를 사용하여 html코드가 저장되어있는 php파일도 불러올수있으며 반복되는 작업을 할때 편리한거 같다.

               <form action="joinSave.php" name="join" method="post">
                    <fieldset>
                        <legend class="blind">회원가입 영역</legend>
                        <div>
                            <label for="youEmail" class="required">이메일</label>
                            <input type="email" id="youEmail" name="youEmail" class="inputStyle" placeholder="이메일을 적어주세요!" required>
                        </div>
                        <div>
                            <label for="youName" class="required">이름</label>
                            <input type="text" id="youName" name="youName" class="inputStyle" placeholder="이름을 적어주세요!" required>
                        </div>
                        <div>
                            <label for="youPass" class="required">비밀번호</label>
                            <input type="password" id="youPass" name="youPass" class="inputStyle" placeholder="비밀번호를 적어주세요!" required>
                        </div>
                        <div>
                            <label for="youPassC" class="required">비밀번호 확인</label>
                            <input type="password" id="youPassC" name="youPassC" class="inputStyle" placeholder="다시 한번 비밀번호를 적어주세요!" required>
                        </div>
                        <div>
                            <label for="youPhone" class="required">연락처</label>
                            <input type="text" id="youPhone" name="youPhone" class="inputStyle" placeholder="연락처를 적어주세요!" required>
                        </div>
                        <button type="submit" class="btnstyle1">회원가입 완료</button>
                    </fieldset>
                </form>

HTML의 form은 사용자와 웹사이트 또는 어플리케이션이 서로 상호 작용하는 것 중 중요한 기술 중에 하나이다. 폼은 사용자가 웹사이트에 데이터를 전송해주기도 하며 이밖에 웹페이지가 입력 데이터를 사용하기 위하여 사용할 수 도 있다.

form을 사용하여

 <form action="joinSave.php" name="join" method="post">

이 코드를 기반으로 사용자가 양식을 제출하면 데이터가 "joinSave.php" 스크립트로 전송되어 데이터를 처리하고 필요한 작업을 수행할 수 있습니다. 양식 이름은 입력 필드와 같은 양식 요소를 참조하는 데 사용할 수 있으며 "post" 메서드는 데이터가 URL에 표시되지 않기 때문에 일반적으로 민감한 데이터나 개인 데이터에 사용됩니다.

label에 class값 required를 주어 입력하지 않을시 페이지가 넘어가지 않게 해줍니다!

joinSavephp

<!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>
<?php include "../include/skip.php" ?>
    <!-- skip -->


    <?php include "../include/header.php" ?>
    <!-- header -->


    <main id="main" class="container">
        <div class="intro__inner center container bmStyle">
            <picture class="intro__images">
                <source srcset="../assets/img/joinend01.png, ../assets/img/joinend01@2x 2x, ../assets/img/joinend01@3x.png 3x" />
                <img src="../assets/img/joinend01.png" alt="회원가입 이미지">
            </picture>
            <p class="intro__text">
                <?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;
    }
    //이메일 중복검사
    $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;
    }

    // 이름 유효성 검사
    $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;
    }
    
        //휴대폰 중복검사
        $isPhoneCheck = false;

        $sql = "SELECT youPhone FROM members WHERE youPhone ='$youPhone'";
        $result = $connect -> query($sql);
    
        if($result){
            $count = $result -> num_rows;
    
            if($count == 0){
                $isEmailCheck = 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) --> 통과 --> 회원가입(쿼리문 전송)

    
?>

        </div>
    </main>

</body>
</html>

  include "../connect/connect.php";

include를 사용해 connect.php의 데이터를 가져와줍니다.

    $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>";
    }

msg 함수를 만들어 주고 msg를 사용하면 화면에 출력되게 해줍니다.

    // 이메일 유효성 검사
    $check_mail = preg_match("/^[a-z0-9_+.-]+@([a-z0-9-]+\.)+[a-z0-9]{2,4}$/",$youEmail);

    if($check_mail == false){
        msg("이메일 잘못되었습니다. 올바른 이메일을 작성해주세요!");
        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;
    }

이메일 유효성 검사를 하기 위해 $check_mail을 정의해줍니다.

preg_match() 를 사용하여 문자열에 패턴을 검색해줍니다.

preg_match()는 정규 표현식을 사용하여 문자열에서 패턴을 검색하는 PHP 함수입니다.

if문을 사용하여 $check_mail == false일 경우 전에 만든 msg를 사용하여 문구 를 띄어줍니다.다음은 이메일 중복 검사입니다.

$isEmailCheck = false 이라고 정의 해줍니다.

    $sql = "SELECT youEmail FROM members WHERE youEmail ='$youEmail'";
    $result = $connect -> query($sql);

위의 코드는 MySQL 데이터베이스에서 "members" 테이블에서 "youEmail" 열에서 "$youEmail" 값과 일치하는 행을 검색하는 SQL 쿼리문입니다.

그리고 $result는 $connect 으로 MySQL 에 연결해줍니다. $sql를 변수$result에 저장해줍니다.

    if($result){
        $count = $result -> num_rows;

        if($count == 0){
            $isEmailCheck = true;
        } else {
            msg("이미 회원가입이 되어있는 이메일 입니다. 로그인 해주세요!");
            exit;
        }
    } else {
        msg("에러발생1 : 관리자에게 문의하세요");
        exit;
    }

"$result"가 "true"인 경우에는 "$result"에서 반환된 행의 수를 계산하여 "$count" 변수에 저장하고, "$count"가 0인 경우 "$isEmailCheck" 변수를 true로 설정합니다. 이것은 중복되지 않는 이메일을 사용하고 있다는 것을 의미합니다.

그러나, "$count"가 0이 아닌 경우에는 이미 회원가입이 되어 있는 이메일이므로, 에러 메시지를 출력하고 코드 실행을 종료합니다.

또한, "$result"가 "false"인 경우에는 쿼리 실행 도중에 오류가 발생한 것이므로, 에러 메시지를 출력하고 코드 실행을 종료합니다.

비밀번호 이름 등 나머지 요소들도 다 해줍니다.

        //회원가입
        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;
        };

위의 코드는 이메일과 전화번호의 중복 여부를 확인한 후, 두 가지 모두 중복되지 않는 경우, 회원 정보를 데이터베이스에 입력하고, 그 결과에 따라 조건문을 실행하는 코드입니다.

일	월	화	수	목	금	토
						1
2	3	4	5	6	7	8
9	10	11	12	13	14	15
16	17	18	19	20	21	22
23	24	25	26	27	28	29
30	31

100S00