유효성 검사

 

유효성 검사(validation)

-사용자가 폼 페이지에서 입력한 데이터 값이 서버로 전송되기 전에 특정 규칙에 맞게 입력되었는지 검증하는 것

-사용자가 실수로 유효하지 않은 데이터 값을 입력하면 부적합하다고 판단하여 다시 폼 페이지로 되돌려 사용자에게 오류가 있음을 알려줌

-유효성 검사의 예 : 폼 페이지에서 나이를 입력할 때 숫자를 인식하는 검사, 회원 가입 시 아이디 중복 검사, 로그인 인증 시 아이디와 비밀번호 검사, IP 패킷 검사 등

 

 

유효성 검사를 위한 핸들러 함수

-핸들러 함수는 폼 페이지에서 이벤트가 발생했을 때(<submit>를 클릭한 경우)의 유효성 검사를 위해 매핑하는 메소드

-자바스크립트를 이용하여 유효성 검사를 위한 코드를 작성

-자바스크립트는 웹 브라우저에서 유효성 검사를 처리하므로 서버에서 처리하는 것보다 속도가 빠르고 서버에 과부하를 주지 않음

-사용자 폼 페이지에 입력한 데이터 값이 서버로 전송되기 전에 특정 규칙에 맞게 입력되었는지를 검사

-입력된 데이터가 유효성 검사를 통과하면 서버로 전송하고, 그렇지 않으면 서버 전송을 취소하고 사용자에게 오류 메시지를 보여주는 역할을 함

 

유효성 검사를 위해 핸들러 함수를 만드는 과정

1)input 태그의 type 속성 값이 submit인 경우 onclick 속성을 이용하여 핸들러 함수를 설정 또는 form태그의 onsubmit 속성 값에 설정

2)자바스크립트를 이용하여 </script>…<script> 내에 핸들러 함수를 작성 <script>…</script> 구문은 JSP 페이지의 어디에 위치해도 상관없음.

3)폼 페이지에서 입력된 데이터 값을 핸들러 함수로 가져오기 위해 form태그의 name 속성 또는 forms체를 이용

 

유효성 검사 처리 방법

기본 유효성 검사 :　폼 페이지에 입력된 데이터 값의 존재 유무를 검사한다.

-사용자가 폼 페이지의 입력 항목에 입력한 데이터 값이 있는지 없는지 확인하고 데이터 길이, 숫자 등 기본적인 것이 맞는지 검사

-폼 페이지의 입력 데이터 길이를 확인하여 데이터의 유무를 검증하는 것은 기본 유효성 검사에 해당

 

데이터 형식 유효성 검사 : 폼 페이지에 입력된 데이터 값이 특정 패턴에 적합한지 여부를 검사하며 정규 표현식을 사용한다.

-사용자가 폼 페이지의 입력 항목에 입력한 데이터 값이 특정 형태에 적합한지 검사하기 위해 정규 표현식(regular expression)을 사용하는 방법

-기본 유효성 검사보다 복잡

 

유효성 검사의 개요
-유효성 검사는 사용자가 폼 페이지에서 입력한 데이터 값이 서버로 전송되기 전에 특정 규칙에 맞게 입력되었는지 검증하는 것을 말한다.
-유효성 검사를 위한 핸들러 함수는 폼 페이지에서 이벤트가 발생했을 때 (을 클릭한 경우)의 유효성 검사를 위해 매핑하는 메소드이다.

기본 유효성 검사
-기본 유효성 검사는 사용자가 폼 페이지의 입력 항목에 입력한 데이터값이 있는지 없는지 확인하고 데이터 길이, 숫자 등 기본적인 것이 맞는지 검사한다.
-데이터 값의 유무에 대한 검사에서는 예를 들어 회원 가입 페이지에서 사용자가 아이디와 비밀번호 등의 필수 입력 항목을 입력하지 않고 <전송>을 클릭하면 입력하지 않았다는 오류 메시지가 나타난다.
-데이터 길이에 대한 검사는 회원 가입 페이지에서 아이디, 비밀번호 등과 같은 입력 데이터의 제한 길이를 확인한다.
-숫자 여부는 isNaN() 함수를 활용하여 검사한다.