CS 면접 준비

유효성 검사 란?

jjong0425 2025. 1. 22. 17:59

💡유효성 검사( Validation )

→ 데이터가 특정 기준이나 규칙을 충족하는지 확인하는 과정이다.

→ 데이터의 정확성과 신뢰성을 보장한다.

예를 들어, 회원가입을 할 때 아이디 중복검사를 하거나

비밀번호를 설정할 때 어떠한 규칙(대문자 필수, 특수문자 필수 등)에 따라 작성해야 되는 등 다양한 것이 있다.


📌유효성 검사의 유형

1. 클라이언트 측 유효성 검사

→ 사용자의 브라우저에서 실행되어 데이터를 입력할 때 즉시 피드백을 제공한다.

  • 장점 : 서버의 부하를 줄일 수 있다.
  • 단점 : 브라우저의 개발자 도구(F12)를 사용하여 우회할 수 있어, 보안에 취약하다.

2. 서버 측 유효성 검사

→ 서버에서 데이터를 처리하기 전에 검사하여 데이터베이스에 저장되기 전에 데이터를 검증한다.

  • 장점 : 브라우저에서 우회가 불가능해 보안이 강화된다.
  • 단점 : 서버의 부하가 증가할 수 있다.

★자바스크립트에서의 유효성 검사 예시

document.getElementById('registrationForm').addEventListener('submit', function(event) {  
    event.preventDefault(); // 기본 제출 동작 방지  

    document.getElementById('usernameError').textContent = '';  
    document.getElementById('emailError').textContent = '';  
    document.getElementById('passwordError').textContent = '';  

    const username = document.getElementById('username').value;  
    const email = document.getElementById('email').value;  
    const password = document.getElementById('password').value;  

    // 유효성 검사  
    let isValid = true;  

    // 사용자 이름 유효성 검사  
    if (username.length < 3) {  
        document.getElementById('usernameError').textContent = 'Username must be at least 3 characters long.';  
        isValid = false;  
    }  

    // 이메일 유효성 검사  
    const emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;  
    if (!emailPattern.test(email)) {  
        document.getElementById('emailError').textContent = 'Please enter a valid email address.';  
        isValid = false;  
    }  

    // 비밀번호 유효성 검사  
    if (password.length < 6) {  
        document.getElementById('passwordError').textContent = 'Password must be at least 6 characters long.';  
        isValid = false;  
    }  

    // 모든 유효성 검사를 통과한 경우  
    if (isValid) {  
        alert('Registration successful!');    
    }  
});

위의 코드를 보면

사용자 이름 길이는 최소 3자보다 커야되고 비밀면호는 최소 6자보다 커야 되고

이메일은 정규표현식을 사용하여 올바른 이메일 형식인지 확인한 후

성공메시지를 보내는 형식이다.

 

나의 생각

유효성 검사란 데이터를 잘못 삽입하는 것을 방지하기 위해

미리 클라이언트(브라우저) or 서버에서 검사하는 것이라고 생각한다.

LIST

'CS 면접 준비' 카테고리의 다른 글

async와 await  (1) 2025.01.23
정규 표현식 이란?  (0) 2025.01.22
인증과 인가 란?  (0) 2025.01.21
싱글톤이란?  (0) 2025.01.21
쿠키와 세션이란 ?  (0) 2025.01.21