PHP

회원가입 로그인 적용

ture403 2023. 4. 19. 20:27

- Frederick Philips Brooks
Mythical Man-Month 저자
728x90
반응형

회원가입 페이지 입니다. 

 

 

회원가입 소스 입니다.  

join.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"?>
    <!-- link -->
</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">
            <div class="intro_images">
                <!-- <img src="assets/img/intro01.png" alt="소개이미지"> -->
                <picture>
                    <source srcset="../assets/img/join01.png , ../assets/img/join01@2x.png 2x, ../assets/img/join01@3x.png 3x">
                    <img src="../assets/img/intro01.png" alt="소개이미지">
                </picture>
            </div>
            <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="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="btnStyle">회원가입 완료</button>
                    </fieldset>
                </form>
            </div>
        </div>
        <!-- join_inner -->

    </main>
    <!-- main -->
</body>
</html>
  • 보시면 link부분은 먼저 따로 lnclude 파일에 head.php에 넣어 주었습니다. 그후include를 시켜 불러왔습니다.
  • 그리고 skip,header부분도 각 각 php 파일을 만들어 include 시켰습니다. 
  • 그리고 from에 액션에 joinsave.php를 넣어서 회원가입 완료를 누르면  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">
            <div class="intro_images">
                <!-- <img src="assets/img/intro01.png" alt="소개이미지"> -->
                <picture>
                    <source srcset="../assets/img/joinEnd01.png , ../assets/img/joinEnd@2x.png 2x, ../assets/img/joinEnd@3x.png 3x">
                    <img src="../assets/img/joinEnd01.png" alt="소개이미지">
                </picture>
            </div>


                <?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;
                    
                    // $sql = "INSERT INTO mymember(youEmail,youName,youPass,youPhone,regTime) VALUES ('$youEmail', '$youName', '$youPass', '$youPhone', '$regTime')";

                    // $connect -> query($sql);

                    
                    //메시지 출력
                    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 mymember WHERE youEmail = '$youEmail'";
                    $result = $connect -> query($sql);
                    
                    if($result){
                        $count = $result -> num_rows;

                        if($count == 0){
                            $isEmailCheck = true;
                        } else {
                            msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
                            exit;
                        }
                    }else {
                        msg("에러발생1 : 관리자 일을 안함 조치점");
                    }

                    //핸드폰 중복 검사
                    $isPhoneCheck = false;
                    
                    $sql = "SELECT youEmail FROM mymember WHERE youEmail = '$youPhone'";
                    $result = $connect -> query($sql);
                    
                    if($result){
                        $count = $result -> num_rows;

                        if($count == 0){
                            $isPhoneCheck = true;
                        } else {
                            msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
                            exit;
                        } 
                    } else {
                        msg("에러발생1 : 관리자 일을 안함 조치점");
                    }
                    //회원가입
                    if($isEmailCheck == true && $$isPhoneCheck = true){
                        // 데이터 입력하기
                        $sql = "INSERT INTO mymember(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("관리자 또 일 암함");
                            exit;
                        }
                    } else{
                        msg("이미 회원가입 되어있음. 로그인 ㄱㄱ");
                        exit;
                    }
                ?>

            <div class="intro_btn"><a href="#">로그인</a></div>
        </div>
        <!-- intro_inner -->


    </main>
    <!-- main -->

</body>
</html>
  • php 소스안에 서 DB정보 및 연결할수 있는 php를 불러옵니다. 
  • 그리고 변수에 이메일, 이름, 패스워드, 패드워드확인, 핸드폰번호을 input에 쓰여진 값을 저장합니다.
  • 그리고 확인가능하게 msg함수 를 만들어서 p태그를 써서 그안에 정보를 나오게 지정했습니다.
  • 유효성 검사를 할겁니다.
  • 먼저 메일을 검사할껀데 $check_mail 안에 정규식표현을 넣어주고 그걸 $youEmail 에 넣었습니다.
  • 이 코드를 사용하여 이메일 주소의 유효성을 검사할 수 있습니다. $check_mail 변수는 1이면 유효한 이메일 주소이고, 0이면 유효하지 않은 이메일 주소입니다. 
  • 그리고 if를 써서 $check_mail값이 false면 msg 함수를 통해서 잘못됬다고 출력했습니다.
  • 이름 유효성 검사,비밀번호 유효성 검사, 휴대폰 번호 유효성 검사, 이메일 중복 검사 핸드폰 중복 검사를 동일하게 진행했습니다.
  • 그리고 회원가입 할때 email 과 핸드폰이 true면 mysql 안에 값을 집어 넣씁니다.
  • 그리고 적용이 됬는지 확인할려고 result가 1이면 축하합니다. 라는 메시지를 뜨고 아니면 관리자에게 문의하라고 메시지 뜨게 만들었습니다.
  • 그리고 회원가입이 되어있으면 로그인 하러 가라고 메시지가 뜹니다.

로그인 화면 입니다.

 

 

login.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"?>
    <!-- link -->
</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" name="youEmail" class="inputStyle"   placeholder="이메일을 적어주세요!" required>
                        </div>
                        <div>
                            <label for="youPass" class="blind required">비밀번호</label>
                            <input type="password" id="youPass" name="youPass" class="inputStyle" 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>
  • login_inner를 만들어서 그안에 로그인 폼을 만들었습니다.
  • 회원가입과 동일하게 form안에 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>회원가입 완료 페이지</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">
            <div class="intro_images">
                <!-- <img src="assets/img/intro01.png" alt="소개이미지"> -->
                <picture>
                    <source srcset="../assets/img/joinEnd01.png , ../assets/img/joinEnd@2x.png 2x, ../assets/img/joinEnd@3x.png 3x">
                    <img src="../assets/img/joinEnd01.png" alt="소개이미지">
                </picture>
            </div>


<?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 mymember 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);

            // echo "<pre>";
            // var_dump($memberInfo);
            // echo "</pre>";

            //세션 생성
            $_SESSION['memberID'] = $memberInfo['memberID'];
            $_SESSION['youEmail'] = $memberInfo['youEmail'];
            $_SESSION['youName'] = $memberInfo['youName'];

            Header("Location: ../main/main.php");
        }
    }

?>

        </div>
        <!-- intro_inner -->


    </main>
    <!-- main -->

</body>
</html>
  • 다음 두 줄에서는 로그인 폼에서 입력받은 이메일과 비밀번호 값을 $youEmail과 $youPass 변수에 저장합니다.
  • 그 다음으로 msg() 함수가 정의됩니다. 이 함수는 인자로 받은 문자열을 <p> 태그로 감싸서 출력하는 역할을 합니다.
  • 이어서 $sql 변수에는 로그인 정보를 조회하기 위한 쿼리문이 저장됩니다. $youEmail과 $youPass 변수를 이용하여 mymember 테이블에서 이메일과 비밀번호가 일치하는 회원 정보를 조회합니다.
  • $result 변수에는 위에서 정의한 쿼리문을 실행한 결과가 저장됩니다. $result에 저장된 값이 존재한다면, num_rows 함수를 이용하여 조회된 결과의 행 개수를 구합니다. 이 개수가 0이면 이메일 또는 비밀번호가 틀렸다는 메시지를 출력하고, 0이 아니라면 로그인에 성공했다는 메시지를 출력합니다.
  • 로그인에 성공한 경우, $memberInfo 변수에는 로그인한 회원의 정보가 배열 형태로 저장됩니다. fetch_array 함수의 MYSQLI_ASSOC 옵션을 사용하여 연관 배열 형태로 값을 가져옵니다.
  • 마지막으로, $_SESSION 변수를 이용하여 세션을 생성하고, Header() 함수를 이용하여 메인 페이지로 이동합니다.
  • Header() 함수는 HTTP 헤더를 사용하여 페이지를 이동시키는 함수입니다.

logout.php 입니다.

<?php
    include "../connect/session.php";

    unset($_SESSION['memberID']);
    unset($_SESSION['youEmail']);
    unset($_SESSION['youName']);

    Header("Location: ../main/main.php");
?>
  • unset() 함수를 이용하여 $_SESSION 변수에서 로그인 시 생성된 memberID, youEmail, youName 세션 변수를 삭제합니다. 이를 통해 로그아웃 상태로 변경됩니다.
  • Header() 함수를 이용하여 메인 페이지로 이동합니다. Header() 함수는 HTTP 헤더를 사용하여 페이지를 이동시키는 함수입니다. 로그아웃 후 메인 페이지로 이동하기 때문에 해당 코드에서는 메인 페이지로 이동하는 코드입니다.