Ajax로 Spring Controller 에서 패스워드 유효성 검사 방법.

유효성 검사는 jsp 뷰단에서 자바스크립트로만 했었는데 Ajax로 한단어 한단어 체크하여 패스워드 유효화 체크를 한번 구현해 봄.

 

참고 : https://xxxelppa.tistory.com/56

        http://sunkyun.com/community/bbs/board.php?bo_table=script&wr_id=13

        https://hongku.tistory.com/249

        https://sgroom.tistory.com/112

@RequestMapping(value = "/pwCheck", method = RequestMethod.POST)
	@ResponseBody
	public boolean PwCheck(String pw) {		
		logger.info("PwCheck");		
		
		boolean check = false;	

		String pw_chk = "^(?=.*[A-Za-z])(?=.*[0-9])(?=.*[$@$!%*?&`~'\"+=])[A-Za-z[0-9]$@$!%*?&`~'\"+=]{6,18}$";
				
		Pattern pattern_symbol = Pattern.compile(pw_chk);		
		Matcher matcher_symbol = pattern_symbol.matcher(pw);		
		
		if(matcher_symbol.find()) {	
			check = true;
		}		
		return check;
	}

$(document).ready(function(){
	$('#pw1').keyup(function(){
		$('#pwCheckFF').text('');
	}); 
	
	$('#repw1').keyup(function(){
		if($('#pw1').val()!=$('#repw1').val()){
			$('#pwCheckFF').text('');
	  		$('#pwCheckFF').html("패스워드 확인이 불일치 합니다");
	 	}else{
		  	$('#pwCheckFF').text('');
		  	$('#pwCheckFF').html("<font color='#70AD47'>패스워드 확인이 일치 합니다.</font>");
	 	}
	});
 }); 
 
 //비밀번호 실시간 유효성 체크
function pwCheck(pw){
	$.ajax({
		type:"POST",
		url: "/pwCheck",
		data : { pw: pw },
		success:function(result){	
			if(result == true){				
				pwCheckF.innerHTML = "유효성 체크 문제 없음"; 				
			}else{				
				pwCheckF.innerHTML = "유효성 체크 범위 벗어남"; 
			}
		},
    	error:function(request,status){
    		alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
    	}
	});	
	
}

 

<input type="password" class="join" name="pw" id="pw1" oninput="pwCheck(pw1.value)" tabindex="2" placeholder="비밀번호" />
<input type="password" class="join" name="repw" id="repw1" tabindex="3" placeholder="비밀번호 확인"/>
<p id="pwCheckF" style="color: #FF6600; margin: 0;"></p>
<p id="pwCheckFF" style="color: #FF6600; margin: 0;"></p>