지식노트
[JS] 회원가입 유효성 검사
디두딘
2022. 5. 4. 09:31
회원가입 유효성검사
회원가입시 각 필드마다 유효성 검사를 하여 처리 할 수 있도록 만들어라.
1. ID는 영어 소문자, 숫자만 가능해야 함 (4~12자리, 소문자로 시작해야함)
2. 비밀번호는 숫자/문자/특수문자(*!&) 포함 형태의 8~15자리
3. 비밀번호와 비밀번호 확인은 같아야 함
4. 이름은 무조건 한글만 가능해야 함(최소 2글자 이상)
5. 주민번호는 자릿수 6자리, 7자리이고, 모두 숫자여야함.
6. 이메일은 @가 포함 되어야 함(@ 앞에가 영문자, 숫자로 4~12글자 )
7. 전화번호는 첫번째 필드는 010만 입력 가능 해야 함
두번째 필드는 3자리 이상 입력 해야 함
세번째 필드는 무조건 4자리 입력 해야함 (모두 숫자만 가능 해야함)
// 1. 아이디검사
// 첫글자는 반드시 영소문자로 이루어지고,
// 숫자가 하나이상 포함되어야함.
// 아이디의 길이는 4~12글자 사이
var regExp1 = /^[a-z][a-z\d]{3,11}$/;
var regExp2 = /[0-9]/;
if(!regExpTest(regExp1
,userId
,"아이디는 영소문자로 시작하는 4~12글자입니다."))
return false;
if(!regExpTest(regExp2
,userId
,"아이디는 숫자를 하나이상 포함하세요."))
return false;
// 2.비밀번호 확인 검사
// 숫자/문자/특수문자/ 포함 형태의 8~15자리 이내의 암호 정규식
// 전체길이검사 /^.{8,15}$/
// 숫자하나 반드시 포함 /\d/
// 영문자 반드시 포함 /[a-zA-Z]/
// 특수문자 반드시 포함 /[\*!&]/
var regExpArr = [/^.{8,15}$/, /\d/, /[a-zA-Z]/, /[\*!&]/];
for(let i = 0; i < regExpArr.length; i++){
if(!regExpTest(regExpArr[i], pwd, "비밀번호는 8~15자리 숫자/문자/특수문자를 포함해야합니다.")){
return false;
}
}
// 비밀번호일치여부
if(!isEqualPwd()){
return false;
}
// 3. 이름검사
// 한글2글자 이상만 허용. [가-힣] 으로 해도되긴 하지만 자음만(ㄱㄴㄷㄹ)있으면 필터링이 안됨
var regExp3 = /^[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]{2,}$/;
if(!regExpTest(regExp3,userName,"한글2글자이상 입력하세요."))
return false;
// 4.주민번호체크
var regExp4 = /^\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2][0-9]|3[01])$/;
var regExp5 = /^[1234]\d{6}$/;
if(!regExpTest(regExp4,ssn1,"숫자만 입력하세요."))
return false;
if(!regExpTest(regExp5,ssn2,"숫자만 입력하세요."))
return false;
if(!ssnCheck(ssn1.value,ssn2.value)){
alert("올바른 주민번호가 아닙니다.");
return false;
}
// 5.이메일 검사
// 4글자 이상(\w = [a-zA-Z0-9_], [\w-\.]) @가 나오고
// 1글자 이상(주소). 글자 가 1~3번 반복됨
if(!regExpTest(/^[\w]{4,}@[\w]+(\.[\w]+){1,3}$/, email, "이메일 형식에 어긋납니다."))
return false;
// `/^[\w]{4,}@[\w]+(\.[\w]+){1,3}$/`
// 1. `^[\w]{4,}@` 시작하고 영문자/숫자/_4글자이상나오고 `@` 가 이어지는지
// 2. `@[\w]+` @이후 영문자/숫자/_가 한글자 이상
// 3. `(\.[\w]+){1,3}$` `\.` . (escaping) 이후 영문자/숫자/_가 1~3글자 나오고 끝나는지
// 6. 전화번호 검사
// 전화번호 앞자리는 010, 두번째 자리는 3~4자리 숫자, 세번째 자리는 4자리 숫자
if (!regExpTest(/^010$/, tel1, "번호 2자리 이상 입력"))
return false;
if (!regExpTest(/^[0-9]{3,4}$/, tel2, "번호 3자리 이상 입력"))
return false;
if (!regExpTest(/^[0-9]{4}$/, tel3, "4자리 번호 입력"))
return false;
return true;
}
function ssnCheck(ssn1, ssn2){
var ssn = ssn1 + ssn2;
/*
주민등록번호 체계 및 유효성 검사 (javascript)
https://eyecandyzero.tistory.com/240
// 900909-1234561
var total = 9*2 + 0*3 + 0*4 + 9*5 + 0*6 + 9*7 + 1*8 + 2*9 + 3*2 + 4*3 + 5*4 + 6*5; //220
var result = total % 11; //0
result = 11 - 0; //11
result = result % 10; //1
if(result == 13번째자리수) return true;
else return false;
*/
var total = 0;
for(var i = 0; i < 12; i++){
if(i < 8){
total += parseInt(ssn.substr(i, 1)) * (i + 2);
}
else {
total += parseInt(ssn.substr(i, 1)) * (i - 6);
}
}
//마지막수와 비교할 수 구하기
var result = (11 - (total % 11)) % 10;
//마지막수(13번째 자리)
var num13 = parseInt(ssn.substr(12, 1));
console.log(result + '==' + num13);
//결과
if(result == num13)
return true;
else
return false;
}