이전 글에서 사용한 키 값인 isLoggedIn을 logged_in으로 전체적으로 바꿈
이전 글 마지막에 적었듯 회원가입 기능을 구현해보자.
1. 회원가입 화면으로 이동할 수 있도록 login.php에 링크와 Routes.php를 수정하자
<?php
//login.php
?>
...생략
<a href="join">가입</a>//....생략
$routes->get('join', 'Login::join'); //회원가입 화면
$routes->post('checkUserId', 'Login::checkUserId'); //아이디 중복 체크
$routes->post('join_ok', 'Login::join_ok'); //회원가입 처리
2. 회원가입 화면 만들기
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>회원가입</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<form id="joinForm" action="join_ok" method="post">
<label for="user_id">아이디:</label>
<input type="text" id="user_id" name="user_id">
<button type="button" id="checkId">중복 체크</button><br>
<label for="user_pw">비밀번호:</label>
<input type="password" id="user_pw" name="user_pw"><br>
<label for="user_name">이름:</label>
<input type="text" id="user_name" name="user_name"><br>
<button type="submit">가입하기</button>
</form>
<script>
$(document).ready(function() {
$('#checkId').click(function() {
checkUserId();
});
$('#joinForm').submit(function(e) {
e.preventDefault(); // 폼 기본 제출 방지
var userid = $('#user_id').val();
var password = $('#user_pw').val();
var name = $('#user_name').val();
// 입력값 검증
if (!userid || !password || !name) {
alert('모든 필드를 입력해주세요.');
return;
}
// 아이디 중복 검사 후 가입 처리
$.ajax({
url: 'checkUserId',
type: 'POST',
data: {userid: userid},
success: function(data) {
if (data.message === '사용 가능한 아이디입니다.') {
$('#joinForm').unbind('submit').submit();
} else {
alert(data.message);
}
}
});
});
});
function checkUserId() {
var userid = $('#user_id').val();
$.ajax({
url: 'checkUserId',
type: 'POST',
data: {userid: userid},
success: function(data) {
alert(data.message);
}
});
}
</script>
</body>
</html>
3. Login 컨트롤러에 join, join_ok, checkUserId 메서드 추가
public function join(){
//회원 가입 화면으로 이동
return view('join');
}
public function checkUserId(){
$user_id = $this->request->getPost('user_id');
$model = new UserModel();
$data = $model -> where('user_id', $user_id)->first();
if($data){
return $this->response->setJSON(['message' => '이미 사용 중인 아이디입니다.']);
}else{
return $this->response->setJSON(['message' => '사용 가능한 아이디입니다.']);
}
}
public function join_ok(){
$user_id = $this->request->getPost('user_id');
$user_pw = $this->request->getPost('user_pw');
$user_name = $this->request->getPost('user_name');
// 입력 값 검증: 아이디, 비밀번호, 이름이 모두 입력되었는지 확인
if (empty($user_id) || empty($user_pw) || empty($user_name)) {
session()->setFlashdata('error', '모든 필드를 입력해야 합니다.');
return redirect()->back();
}
$model = new UserModel();
// 아이디 중복 검사
$data = $model -> where('user_id', $user_id)->first();
if ($data) {
session()->setFlashdata('error', '이미 사용 중인 아이디입니다.');
return redirect()->back();
}
$new_data = [
'user_id' => $user_id,
'user_pw' => password_hash($user_pw, PASSWORD_DEFAULT),
'user_name' => $user_name
];
// 데이터베이스에 삽입
$model->insert($new_data);
// 삽입된 사용자의 ID를 얻음
$insertedId = $model->insertID();
// 삽입된 사용자의 데이터를 조회
$insertedUserData = $model->find($insertedId);
$session = session();
// 사용자 정보를 배열로 만들어 뷰에 전달
$sessionData = $insertedUserData;
$sessionData['logged_in'] = true;
$session -> set($sessionData);
$userData = [
'user_no' => $session->get('user_no'),
'user_id' => $session->get('user_id'),
'user_name' => $session->get('user_name'),
'user_rank' => $session->get('user_rank'),
'logged_in' => $session->get('logged_in')
];
return view('login_ok',['userData' => $userData]);
}
이번 글에서는 AJAX를 활용해서 DB의 값과 비교해 중복된 아이디를 확인해보고, 결과에 따라 데이터를 추가하는 처리를 했다. 데이터 추가 후에는 방금 INSERT한 ROW를 가져와 바로 세션 로그인 처리를 해서 로그인 성공 페이지까지 이동시키는 것 까지 구현을 했다.
다음 글에서는 내 정보를 수정하고, 수정할 때 비밀번호를 한번 더 검증 받는 처리를 해보자.
반응형
'개발 > php' 카테고리의 다른 글
| 코드이그나이터4 - 단순 회원정보 수정 (4) (0) | 2024.03.18 |
|---|---|
| 코드이그나이터4 - 단순 로그인 기능 구현 DB 연결 (2) (0) | 2024.03.11 |
| 코드이그나이터4 - 단순 로그인 기능 구현 (1) (0) | 2024.03.06 |
| 코드이그나이터 4 (2) - 시작 페이지 변경, 공통 페이지, 정적 파일 관리 (1) | 2024.02.28 |
| 코드이그나이터 4 (1) - 시작하기 (0) | 2024.02.27 |
댓글