상세 컨텐츠

본문 제목

자바스크립트 - 비밀번호 작성규칙 유효성 검사

javascript

by new wind 2021. 4. 21. 17:21

본문

정규식을 활용한 유효성 검사

 

html 파일 부분

	<form id="frm" method="post" action="pass_update.php">
		<input type="hidden" name="user_id" id="user_id" value="<?=$login_id?>">
		<table>
		<tr>
			<td colspan="2">비밀번호 변경</td>
		</tr>
		<tr>
			<td>현재 비밀번호</td>
			<td><input type="password" name="password_current" id="password_current"></td>
		</tr>
		<tr>
			<td>변경 비밀번호</td>
			<td><input type="password" name="password_new_1" id="password_new_1"></td>
		</tr>
		<tr>
			<td>비밀번호 재입력</td>
			<td><input type="password" name="password_new_2" id="password_new_2"></td>
		</tr>
		<tr>
			<td colspan="2">
				<button type="button" class="btn-success btn" id="btn_submit">변경하기</button>
			</td>
		</tr>
		</table>
	</form>

 

js 파일 부분

 

<script>
addLoadEvent(function(){
	$('#password_current').focus();
});


$('#btn_submit').on('click',function()
{
	var id = $('#user_id').val();
	var pw = $('#password_current').val();
	var pw1 = $('#password_new_1').val();
	var pw2 = $('#password_new_2').val();

	var pw1_length = pw1.length;
	var hangul_use = pw1.search(/[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/gi);
	hangul_use = 0;

	// 기본체크
	if( pw.length<6 ) {
		alert('현재 비밀번호를 입력해주세요');
		$('#password_current').focus();
		return false;
	} else if( pw1_length<8 ) {
		alert('비밀번호 자릿수가 부족합니다');
		$('#password_new_1').focus();
		return false;
	} else if( pw==pw1 ) {
		alert('새 비밀번호는 기존비밀번호와 다르게 입력해 주세요');
		$('#password_new_1').focus();
		return false;
	} else if( pw1!=pw2 ) {
		alert('변경할 비밀번호 2개를 동일하게 입력해주세요');
		$('#password_new_2').focus();
		return false;
	} else if( hangul_use ) {
		alert('비밀번호에는 한글을 사용할 수 없습니다');
		$('#password_new_1').focus();
		return false;
	} else if(pw1.search(/\s/) != -1) {
		alert("비밀번호는 공백 없이 입력해주세요.");
		$('#password_new_1').focus();
		return false;
	} else if(/(\w)\1\1\1/.test(pw1)){
		alert('같은 문자를 4번 이상 사용하실 수 없습니다.');
		$('#password_new_1').focus();
		return false;
	} else if(pw1.search(id) > -1){
		alert("비밀번호에 아이디가 포함되었습니다.");
		$('#password_new_1').focus();
		return false;
	} else {
		// 좀더 세밀하게 비밀번호 규칙 적용 체크
		var num = pw1.search(/[0-9]/g);
		var eng_large = pw1.search(/[A-Z]/g);
		var eng_small = pw1.search(/[a-z]/g);
		var spe = pw1.search(/[`~!@@#$%^&*|₩₩₩'₩";:₩/?]/g);


		var compound_cnt = 0;
		if (num>=0) {
			compound_cnt++;
		}
		if (eng_large>=0) {
			compound_cnt++;
		}
		if (eng_small>=0) {
			compound_cnt++;
		}
		if (spe>=0) {
			compound_cnt++;
		}

		var pw_check_1 = false;
		var pw_check_2 = false;

		// 체크1 : 2가지 이상 조합으로 10자리 이상인가
		if ( compound_cnt>=2 && pw1_length>=10 ) {
			pw_check_1 = true;
		}

		// 체크1 : 3가지 이상 조합으로 8자리 이상인가
		if ( compound_cnt>=3 && pw1_length>=8 ) {
			pw_check_2 = true;
		}

		if (pw_check_1==true || pw_check_2==true) {
			// ok
		} else {
			alert('비밀번호는 아래 2가지 방법 중 하나로 입력해주세요\n
			(영문대문자,소문자,숫자,특수문자 중)\n
			1) 2개이상 조합 10자리 이상\n
			2) 3개이상 조합 8자리 이상');
			$('#password_new_1').focus();
			return false;
		}

		// 연속배열4자리(알파벳,숫자순,키보드순) 이상 사용 체크
		var key_arr = [];

		key_arr[0] = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
		key_arr[1] = "abcdefghijklmnopqrstuvwxyz";
		key_arr[2] = "01234567890";
		key_arr[3] = "~!@#$%^&*()_+";
		key_arr[4] = "QWERTYUIOP{}|";
		key_arr[5] = "ASDFGHJKL:";
		key_arr[6] = "ZXCVBNM<>?";
		key_arr[7] = "qwertyuiop[]";
		key_arr[8] = "asdfghjkl;";
		key_arr[9] = "zxcvbnm,./";


		var search_pw = ""; // 검색할 비밀번호중 4자리 문자
		var str_locate = -1;
		for (var i = 0; i < pw1_length-4; i++) {
			search_pw = pw1.substring(i,i+4);
			for (var str_i = 0; str_i < key_arr.length; str_i++ ) {
				str_locate = key_arr[str_i].indexOf(search_pw);
				if (str_locate>=0) {
					alert('연속으로 이어져 있는 4자리 문자 사용할 수 없습니다\n
					(알파벳,숫자 또는 키보드자판의 연속배열)');
					$('#password_new_1').focus();
					return false;
				}
			}
		}
		if (confirm('비밀번호 변경합니다')) {

			// submit 처리

		}
	}
});
</script>

 

 

관련글 더보기