HTML5 input 태그의 pattern 속성으로 클라이언트 측 유효성 검사를 할 수 있다.
pattern 속성
input type=text pattern=[A-Za-z]{3} 이러면 영문 3글자만 입력 가능. 정규표현식 테스터에서 패턴을 검증하고 적용하자.
전체 매칭
pattern 속성은 자동으로 ^와 $가 붙는다. 전체가 패턴과 일치해야 통과.
사용자 메시지
title 속성에 설명을 넣으면 유효성 검사 실패 시 보여준다. 하지만 서버 측 검증도 반드시 해야 한다. pattern은 우회 가능하니까. 테스터로 패턴 확인 후 서버에서도 같은 패턴으로 검증하자.
에러 처리 고려하기
잘못된 정규표현식은 런타임 에러를 일으킬 수 있다. 동적으로 패턴을 만들 때는 try-catch로 감싸거나 미리 검증하자. 정규표현식 테스터에서 문법 오류를 미리 확인할 수 있다.
유니코드 처리
한글이나 이모지 같은 유니코드 문자를 처리할 때는 u 플래그가 필요할 수 있다. 다국어 지원이 필요하면 유니코드 문자 클래스를 활용하자.
보안 측면에서
사용자 입력으로 정규표현식을 만들면 ReDoS 공격에 취약할 수 있다. 신뢰할 수 없는 입력을 패턴으로 쓰지 말고, 꼭 필요하면 타임아웃을 설정하자. 테스터로 다양한 입력에 대한 동작을 확인하고 안전하게 사용하자.
복잡한 문자열 처리가 필요할 때 gimo.kr 정규표현식 테스터를 활용하면 패턴 작성과 검증이 훨씬 수월해진다. 실무에서 자주 쓰이는 패턴들을 익혀두면 생산성이 크게 올라간다.