[웹개발] 로그인/로그아웃, 메인 페이지, 회원가입
* 개인적인 공부 내용을 기록한 글입니다.
1주차 개발 과제
1. 가상 환경에 Ubuntu 설치
2. APM 세팅
3. 로그인/로그아웃, 메인 페이지 개발
소감
PHP + Mysql 을 통해 로그인 기능을 구현했다.
로그인 시 DB에 저장된 ID/PW 와 일치 여부를 확인하고
성공하면 세션을 발급해서 다른 페이지로 넘어가도 로그인 상태를 유지할 수 있도록 했다.
로그아웃 시에는 발급해준 세션을 삭제한다.
내친 김에 회원가입 기능도 만들어봤는데
로그인 기능과 크게 다른 점은 없는 것 같다.
회원가입 시 폼에 기입한 정보를 쿼리문에 적어서 DB로 넘겨줬다.
지금 상태에서는 PW를 평문인 상태로 바로 저장하는데.. 곧 암호화 과정을 추가해줄 생각이다.
앗 그리고.. 새로운 회원 정보가 테이블에 들어가면서 Auto_increment가 꼬이는 경우가 있어서
회원이 추가될 때마다 자동증가 컬럼을 재정렬해줄 수 있게 멀티 쿼리를 사용했다.
기능을 만들고나니 이왕이면 좀 예뻤으면 해서 CSS 적용도 해봤다.
블로그에 올릴 생각을 못해서 중간 과정을 따로 찍어둔게 없었는데
마침 커밋을 해둬서 다행이었다.
이 포스팅에 첨부된 코드는 필요한 기능만 구현했을 때의 모습이다.
git 과거로 갔다가 다시 돌아오는 방법
$ git checkout HEAD~
뒤에 돌아가고 싶은 단계만큼 숫자를 붙여주면 된다.
예를 들어, 한 단계 전으로 돌아가고 싶다면
$ git checkout HEAD~1
다시 돌아오는 방법은
$ git checkout main
main 자리에는 master 등 돌아오고 싶은 브랜치 이름을 넣어주면 된다.
참고 포스팅
http://parkjuwan.dothome.co.kr/wordpress/2017/07/11/php-session-login/
PHP / Mysql 로그인 기능 구현
0. 요약
1. main.php
2. login.php
3. login_ok.php //로그인 처리
4. logout.php
1. main.php
<!DOCTYPE html>
<?php session_start(); ?>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Main</title>
</head>
<body>
<h1>MAIN</h1>
<?php
if(!isset($_SESSION['user_id']) || !isset($_SESSION['user_name'])) {
echo "<p>로그인을 해 주세요.</p>";
echo "<p><button onclick=\"window.location.href='login.php'\">로그인</button> <button onclick=\"window.location.href='join.php'\">회원가입</button></p>";
} else {
$user_id = $_SESSION['user_id'];
$user_name = $_SESSION['user_name'];
echo "<p>$user_name($user_id)님 환영합니다.";
echo "<p><button onclick=\"window.location.href='logout.php'\">로그아웃</button></p>";
}
?>
</body>
</html>2. login.php
<!DOCTYPE html>
<?php session_start(); ?>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Login</title>
</head>
<body>
<h2>로그인</h2>
<?php if(!isset($_SESSION['user_id']) || !isset($_SESSION['user_name'])) { ?>
<form method="post" action="login_ok.php" autocomplete="off">
<p>아이디: <input type="text" name="user_id" required></p>
<p>비밀번호: <input type="password" name="user_pw" required></p>
<p><input type="submit" value="로그인"></p>
</form>
<small><a href="join.php">처음 오셨나요?</a><small>
<?php } else {
$user_id = $_SESSION['user_id'];
$user_name = $_SESSION['user_name'];
echo "<p>$user_name($user_id)님은 이미 로그인되어 있습니다.";
echo "<p><button onclick=\"window.location.href='main.php'\">메인으로</button> <button onclick=\"window.location.href='logout.php'\">로그아웃</button></p>";
} ?>
</body>
</html>3. login_ok.php
<?php
$user_id = $_POST['user_id'];
$user_pw = $_POST['user_pw'];
$conn = mysqli_connect('localhost', 'choco', '7173', 'study_login');
$sql = "SELECT * FROM member where login_id='$user_id' and login_pw='$user_pw'";
$res = mysqli_fetch_array(mysqli_query($conn,$sql));
if($res){
session_start();
$_SESSION['user_id'] = $res['login_id'];
$_SESSION['user_name'] = $res['name'];
echo "<script>alert('로그인에 성공했습니다!');";
echo "window.location.replace('main.php');</script>";
exit;
}
else{
echo "<script>alert('아이디 혹은 비밀번호가 잘못되었습니다.');";
echo "window.location.replace('login.php');</script>";
}
?>
<meta http-equiv="refresh" content="0;url=main.php">4. logout.php
<?php
session_start();
session_destroy();
?>
<meta http-equiv="refresh" content="0;url=main.php">PHP / Mysql 회원가입 기능 구현
0. 요약
1. join.php
2. join_ok.php //회원가입 처리
1. join.php
<!DOCTYPE html>
<?php session_start(); ?>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Join</title>
</head>
<body>
<h2>회원가입</h2>
<?php if(!isset($_SESSION['user_id']) || !isset($_SESSION['user_name'])) { ?>
<form method="post" action="join_ok.php" autocomplete="off">
<p>이름: <input type="text" name="join_name" required></p>
<p>아이디: <input type="text" name="join_id" required></p>
<p>비밀번호: <input type="password" name="join_pw" required></p>
<p><input type="submit" value="가입하기"></p>
</form>
<small><a href="login.php">이미 회원이신가요?</a><small>
<?php } else {
$user_id = $_SESSION['user_id'];
$user_name = $_SESSION['user_name'];
echo "<p>$user_name($user_id)님은 이미 로그인되어 있습니다.";
echo "<p><button onclick=\"window.location.href='main.php'\">메인으로</button> <button onclick=\"window.location.href='logout.php'\">로그아웃</button></p>";
} ?>
</body>
</html>2. join_ok.php
<?php
if (!isset($_POST['join_name']) || !isset($_POST['join_id']) || !isset($_POST['join_pw'])) {
header("Content-type: text/html; charset=UTF-8");
echo "<script>alert('기입하지 않은 정보가 있거나 잘못된 접근입니다.')";
echo "window.location.replace('join.php');</script>";
exit;
}
$join_name = $_POST['join_name'];
$join_id = $_POST['join_id'];
$join_pw = $_POST['join_pw'];
$conn= mysqli_connect('localhost', 'choco', '7173', 'study_login');
//신규 회원정보 삽입 + ID 재정렬
$multi = "
INSERT INTO member(name, login_id, login_pw, created) VALUES ('{$join_name}', '{$join_id}', '{$join_pw}', now());
SET @COUNT = 0;
UPDATE member SET id = @COUNT:=@COUNT+1;
";
$res = mysqli_multi_query($conn,$multi);
if($res){
echo "<script>alert('회원가입이 완료되었습니다.');";
echo "window.location.replace('login.php');</script>";
exit;
}
else{
echo "<script>alert('저장에 문제가 생겼습니다. 관리자에게 문의해주세요.');";
echo mysqli_error($conn);
}
?>
<meta http-equiv="refresh" content="0;url=main.php">