반응형
지난번에 회원가입할때 비밀번호 규칙을 지정하지 않고 그냥 가입 처리를 했다. 그래서 1111도 가입이 되는 상황이라 이건 아닌것 같아 비밀번호 규칙을 지정해보려고 한다. 지정할 규칙은 "문자, 숫자, 특수문자를 포함하여 8자이상" 입력이다.
우선 회원가입 페이지를 수정해야 한다.
/resources/views/member/signup.blade.php
@extends('blog.layout')
@section('content')
<div class="container section-title" style="margin-bottom:0px;margin-top:10px;" data-aos="fade-up">
<div class="section-title-container d-flex align-items-center justify-content-between" style="padding-bottom:0px;">
<h2>회원가입</h2>
<p>회원가입 페이지입니다.</p>
</div>
</div>
<!-- End Section Title -->
<div class="container">
<div class="row">
<div class="col-lg-12">
<section class="vh-100">
<div class="container h-100">
<div class="row d-flex justify-content-center align-items-center h-100">
<div class="col-xl-9">
<div class="card" style="border-radius: 15px;">
<div class="card-body">
<div class="row align-items-center pt-4 pb-3">
<div class="col-md-3 ps-5">
<h6 class="mb-0">이름(닉네임)</h6>
</div>
<div class="col-md-9 pe-5">
<input type="text" name="username" id="username" class="form-control form-control-lg" />
<br>
<span id="usernamemsg"></span>
</div>
</div>
<hr class="mx-n3">
<div class="row align-items-center py-3">
<div class="col-md-3 ps-5">
<h6 class="mb-0">이메일</h6>
</div>
<div class="col-md-9 pe-5">
<input type="email" name="email" id="email" class="form-control form-control-lg" placeholder="example@example.com" /><br>
<span id="emailmsg"></span>
</div>
</div>
<hr class="mx-n3">
<div class="row align-items-center py-3">
<div class="col-md-3 ps-5">
<h6 class="mb-0">비밀번호</h6>
</div>
<div class="col-md-9 pe-5">
<input type="password" name="password" id="password" class="form-control form-control-lg" />
<span id="passwordmsg">비밀번호는 문자, 숫자, 특수문자포함해서 8자 이상 입력해 주십시오.</span>
</div>
</div>
<hr class="mx-n3">
<div class="row align-items-center py-3">
<div class="col-md-3 ps-5">
<h6 class="mb-0">비밀번호 확인</h6>
</div>
<div class="col-md-9 pe-5">
<input type="password" name="password_confirmation" id="password_confirmation" class="form-control form-control-lg" />
</div>
</div>
<hr class="mx-n3">
<div class="px-5 py-4" style="text-align:center;">
<button type="button" data-mdb-button-init data-mdb-ripple-init class="btn btn-primary btn-lg" id="signup">가입하기</button>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
{{-- @include('blog.classroomside') --}}
</div>
</div>
<script>
$("#signup").click(function () {
var username=$("#username").val();
var email=$("#email").val();
var password=$("#password").val();
var password_confirmation=$("#password_confirmation").val();
if(!username || !email || !password || !password_confirmation){
alert('필수값을 입력해주세요.');
return false;
}
if(password!=password_confirmation){
alert('비밀번호를 다시 확인해 주십시오.');
return false;
}
var data = {
username : username,
email : email,
password : password,
password_confirmation : password_confirmation
};
$.ajax({
headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
type: 'post',
url: '{{ route('auth.signupok') }}',
dataType: 'json',
data: data,
success: function(data) {
if(data.result==true){
alert(data.msg);
location.href='/login';
}else{
alert(data.msg);
return false;
}
},
error: function(data) {
console.log("error" +JSON.stringify(data));
}
});
});
$("#username").on("keyup", function() {
var username=$("#username").val();
if(!username){
return false;
}
var data = {
username : username
};
$.ajax({
headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
type: 'post',
url: '{{ route('auth.usernamecheck') }}',
dataType: 'json',
data: data,
success: function(data) {
if(data.result==true){
$("#usernamemsg").html("<font color='blue'>"+data.msg+"</font>");
}else{
$("#usernamemsg").html("<font color='red'>"+data.msg+"</font>");
}
},
error: function(data) {
console.log("error" +JSON.stringify(data));
}
});
});
$("#email").on("keyup", function() {
var email=$("#email").val();
if(!email){
return false;
}
var data = {
email : email
};
$.ajax({
headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
type: 'post',
url: '{{ route('auth.emailcheck') }}',
dataType: 'json',
data: data,
success: function(data) {
if(data.result==true){
$("#emailmsg").html("<font color='blue'>"+data.msg+"</font>");
}else{
$("#emailmsg").html("<font color='red'>"+data.msg+"</font>");
}
},
error: function(data) {
console.log("error" +JSON.stringify(data));
}
});
});
</script>
@endsection
뭐가 달라졌냐 하면 password_confirmation 변수가 추가 됐다. 이 파일에서도 비밀번호가 서로 맞는지를 확인하지만 Controller에서도 확인할려고 하는데 그럴려면 변수명을 위처럼 변경해야 한다.
이번엔 Crontroller를 보자.
/app/Http/Controllers/MemberController.php
public function signupok(Request $request){
$validator = Validator::make($request->all(), [
'username' => 'required,
'email' => 'required',
'password' => ['required', 'confirmed', Password::min(8)
->letters()
->numbers()
->symbols()]
]);
if ($validator->fails()) {
return response()->json(array('msg'=> "필수값이 빠졌거나 비밀번호 규칙을 위반했습니다.", 'result'=>false), 200);
exit;
}
$passwd = $request->password;
$passwd = hash('sha512',$passwd);
$uid = explode("@",$request->email);
$form_data = array(
'userid' => $uid[0],
'email' => $request->email,
'passwd' => $passwd,
'username' => $request->username
);
$rs = Members::create($form_data);
if($rs){
return response()->json(array('msg'=> "가입해 주셔서 감사합니다.", 'result'=>true), 200);
}else{
return response()->json(array('msg'=> "실패했습니다. 관리자에게 문의해주세요.", 'result'=>false), 200);
}
}
라라벨 공식 페이지에는 몇개의 옵션을 더 추가해서 권장하고 있지만 우리나라 실정에 맞춰서 대소문자(mixedCase())와 유출된 비밀번호(uncompromised())는 빼고 지정했다.
"문자, 숫자, 특수문자를 포함하여 8자이상" 을 지정하는 방법으로 라라벨 Password를 이용해서 만들어 보았다.
아 password 옵션에 'confirmed'를 지정해줬기때문에 'password_confirmation'이라고 바꿔준것이다. 안그러면 계속 에러난다.
반응형
'PHP강좌 > [라라벨]게시판만들기강좌' 카테고리의 다른 글
| [라라벨+mysql]게시판 만들기 강좌 #31. Storage 사용해서 파일 저장하기 (0) | 2024.08.30 |
|---|---|
| [라라벨+mysql]게시판 만들기 강좌 #30. 완성된 사이트를 서버 호스팅으로 배포하기 (0) | 2024.08.19 |
| [라라벨+mysql]게시판 만들기 강좌의 지금까지 소스 모음 (0) | 2024.08.13 |
| [라라벨+mysql]게시판 만들기 강좌 #29. 함수를 이용해서 새글, 첨부파일, 댓글 수 표시 (0) | 2024.08.13 |
| [라라벨+mysql]게시판 만들기 강좌 #28. 대댓글 (0) | 2024.08.13 |