회원가입
regist.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=, initial-scale=1.0">
<title>Regist</title>
<link rel="stylesheet" href="./regist.css">
</head>
<body>
<div id="login_wrap" class="wrap">
<div>
<h1>Regist</h1>
<form action="registProc.php" method="post" id="regist_form" class="form">
<p><input type="text" name="user_id" id="user_id" placeholder="ID"></p>
<p><input type="button" onclick="checkIdDuplicate()" value="ID 중복확인"></p>
<p><input type="password" name="password" id="password" placeholder="Password"></p>
<p><input type="password" name="password_check" id="password_check" placeholder="Password Check"></p>
<p><input type="text" name="user_name" id="user_name" placeholder="Name"></p>
<p class="gender">
<label><input type="radio" name="gender" id="MALE" value="MALE" checked> MALE</label>
<label><input type="radio" name="gender" id="FEMALE" value="FEMALE"> FEMALE</label>
</p>
<p><input type="text" name="phone" id="phone" placeholder="Phone Number 000-0000-0000"></p>
<p><input type="text" name="email" id="email" placeholder="E-mail"></p>
<p><input type="text" name="postcode" id="postcode" placeholder="우편번호"></p>
<p><input type="button" onclick="execDaumPostcode()" value="우편번호 찾기"></p>
<p><input type="text" name="address_input" id="address_input" placeholder="주소"></p>
<p><input type="text" name="detailAddress" id="detailAddress" placeholder="상세주소"></p>
<script>
function checkIdDuplicate() {
var user_id = document.getElementById("user_id").value;
// 입력된 값이 없을 경우
if (user_id == "") {
alert("아이디를 입력해주세요.");
return;
}
// AJAX 통신으로 서버로 아이디 중복체크 요청을 보냅니다.
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// 서버로부터 응답을 받으면 결과값을 출력합니다.
var result = this.responseText;
if (result == "available") {
alert("사용 가능한 아이디입니다.");
} else {
alert("이미 사용 중인 아이디입니다.");
}
}
};
xhr.open("POST", "checkIdDuplicate.php", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send("user_id=" + user_id);
}
</script>
<script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
<script>
function execDaumPostcode() {
new daum.Postcode({
oncomplete: function(data) {
// 팝업에서 검색결과 항목을 클릭했을때 실행할 코드를 작성하는 부분.
// 각 주소의 노출 규칙에 따라 주소를 조합한다.
// 내려오는 변수가 값이 없는 경우엔 공백('')값을 가지므로, 이를 참고하여 분기 한다.
var addr = ''; // 주소 변수
var extraAddr = ''; // 참고항목 변수
//사용자가 선택한 주소 타입에 따라 해당 주소 값을 가져온다.
if (data.userSelectedType === 'R') { // 사용자가 도로명 주소를 선택했을 경우
addr = data.roadAddress;
} else { // 사용자가 지번 주소를 선택했을 경우(J)
addr = data.jibunAddress;
}
// 우편번호와 주소 정보를 해당 필드에 넣는다.
document.getElementById('postcode').value = data.zonecode;
document.getElementById("address_input").value = addr;
// 커서를 상세주소 필드로 이동한다.
document.getElementById("detailAddress").focus();
}
}).open();
}
</script>
<p><input type="submit" value="Sing Up" class="form_btn"></p>
<p class="regist_btn">Are you join? <a href="index.php"><b>Login</b></a></p></br>
</form>
</div>
</div>
</body>
</html>
회원가입 페이지
checkIdDuplicate.php
<?php
// 데이터베이스 연결
$host = '서버명';
$user = '유저명';
$pw = '비밀번호';
$dbName = 'DB명';
$conn = new mysqli($host, $user, $pw, $dbName);
// POST 방식으로 전송된 아이디를 가져옵니다.
$user_id = $_POST["user_id"];
// 데이터베이스에서 아이디가 존재하는지 확인합니다.
$sql = "SELECT * FROM member WHERE user_id = '$user_id'";
$result = mysqli_query($conn, $sql);
// 아이디가 존재하면 true, 존재하지 않으면 false를 반환합니다.
if (mysqli_num_rows($result) > 0) {
echo "duplicate";
} else {
echo "available";
}
// 데이터베이스 연결 해제
mysqli_close($conn);
?>
registProc.php
<?php
// 회원가입 폼에서 입력받은 정보를 가져온다
$user_id = $_POST['user_id'];
$password = $_POST['password'];
$password_check = $_POST['password_check'];
$user_name = $_POST['user_name'];
$gender = $_POST['gender'];
$phone = $_POST['phone'];
$email = $_POST['email'];
// $postcode = $_POST['postcode'];
// $address_input = $_POST['address_input'];
// $detailAddress = $_POST['detailAddress'];
$address = '[' . $_POST['postcode'] . '] ' . $_POST['address_input'] . ' ' . $_POST['detailAddress'];
// // 사용자 입력값 유효성 검사
if (empty($user_id) || empty($password) || empty($password_check) || empty($user_name) || empty($gender) || empty($phone) || empty($email) || empty($address)) {
// 에러 메시지 출력 후 회원가입 폼으로 되돌아감
echo '<script>alert("필수 입력 항목을 모두 입력해주세요.")</script>';
echo "<script>location.replace('regist.php')</script>";
exit();
}
// 데이터베이스에 연결
$host = 'localhost';
$user = 'user';
$pw = '1234';
$dbName = 'my_site';
$mysqli = new mysqli($host, $user, $pw, $dbName);
// 데이터베이스에서 아이디가 존재하는지 확인합니다.
$sql = "SELECT * FROM member WHERE user_id = '$user_id'";
$result = mysqli_query($mysqli, $sql);
// 아이디가 존재하면 회원가입 폼으로 되돌아감
if (mysqli_num_rows($result) > 0) {
echo '<script>alert("중복된 아이디입니다.")</script>';
echo "<script>location.replace('regist.php')</script>";
}
if ($password !== $password_check) {
// 에러 메시지 출력 후 회원가입 폼으로 되돌아감
echo '<script>alert("비밀번호와 비밀번호 확인이 일치하지 않습니다.")</script>';
echo "<script>location.replace('regist.php')</script>";
}
if ($mysqli->connect_error) {
// 에러 메시지 출력 후 회원가입 폼으로 되돌아감
echo "<script>alert('데이터베이스 연결 실패!')</script>";
echo "<script>location.replace('regist.php')</script>";
exit();
}
// 사용자 정보를 데이터베이스에 삽입
$sql = "INSERT INTO member (user_id, password, user_name, email, gender, phone, address) VALUES ('$user_id', '$password', '$user_name', '$email', '$gender', '$phone', '$address')";
if ($mysqli->query($sql) === TRUE) {
// 성공 메시지 출력 후 로그인 페이지로 이동
echo "<script>alert('회원가입이 완료되었습니다. 로그인해주세요.')</script>";
echo "<script>location.replace('login.php')</script>";
exit();
} else{
// 에러 메시지 출력 후 회원가입 폼으로 되돌아감
echo "<script>alert('오류 발생:')</script>";
echo "<script>location.replace('regist.php')</script>";
}
$mysqli->close();
?>
회원가입에 성공 후 DB 확인