HOWTO · JavaScript

JavaScript에서 Regex로 이메일 유효성 검사

이 기사에서는 JavaScript에서 이메일 주소의 유효성을 검사하는 여러 정규 표현식에 대해 설명합니다. 따라서 사용 사례에 맞는 패턴을 선택할 수 있습니다.

이 기사에서는 다양한 유형의 이메일 주소를 검증할 수 있는 여러 정규 표현식에 대해 설명합니다. 따라서 사용 사례에 가장 적합한 패턴 중 하나를 수정하거나 선택할 수 있습니다.

2~3자 TLD 사이의 이메일을 확인하고 JavaScript의 이메일 및 도메인 이름에 문자를 허용하지 않음

2~3개의 TLD 사이의 이메일 주소를 허용하는 정규식을 작성할 수 있습니다. 예: .com.io.

이것은 또한 패턴이 다음 특성을 가진 이메일을 허용하지 않음을 의미합니다.

  1. 3자 TLD보다 긴 TLD(예: .mobi)
  2. 다중 TLD, 예. (.gmail.sa)
  3. 숫자가 포함된 도메인(예: tech125.com)
  4. 이메일 이름의 마침표(.) 또는 하이픈(-)
  5. 도메인 이름의 하이픈

아래 예제 코드에는 abc@gmail.com, hello@hello.comab0c@gmail.com과 같은 이메일 주소에 대해 true를 반환하는 정규식이 있습니다.

let pattern = /^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/;

function checkEmailAddress(email_address) {
  let result = pattern.test(email_address);
  console.log(result);
}

checkEmailAddress('abc@gmail.com')

출력:

true

한편 패턴은 다음 이메일 주소에 대해 false를 반환합니다.

ab0c@my-domain.com

2~6개의 TLD 이름 사이에서 이메일을 확인하고 JavaScript에서 더하기 로그인 이메일 이름을 허용하지 않음

정규식 패턴은 전자 메일 주소에서 마침표 기호(.)를 허용하고 더하기 기호(+)를 허용하지 않을 수 있습니다. 즉, 더하기 기호가 있는 이메일 주소는 정규식을 통과하지 않습니다.

따라서 유효하더라도 false를 반환합니다. 이 섹션에서 정의할 패턴은 다음과 같은 특성이 있는 이메일에 대해 false를 반환합니다.

  1. 더하기 기호(+)가 있는 이메일
  2. 6자 이상의 TLD, 예. (".기술")

다음 코드에는 새로운 정규 표현식이 있습니다. 한편, 이 패턴은 이전 섹션의 마지막 이메일에 대해 true를 반환합니다.

let pattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;

function checkEmailAddress(email_address) {
  let result = pattern.test(email_address);
  console.log(result);
}

checkEmailAddress('ab0c@my-domain.com')

출력:

true

한편, 아래 나열된 이메일 주소는 이 패턴을 통과하지 않습니다. 그러나 일부 이메일 공급자에게는 모두 유효합니다.

ab+c@my-domain.com
mr+john@my-domain.com.ga

이메일 확인 및 JavaScript의 이메일 및 도메인 이름에 숫자 및 유효한 문자 허용

오늘날 존재하는 대부분의 유효한 메일 주소를 허용하는 유연한 정규식 패턴을 작성할 수 있습니다. 이러한 이메일은 다음과 같은 특징을 갖습니다.

  1. 마침표와 같은 일부 문자는 이메일 및 TLD 이름에 로그인합니다.
  2. .technology.business와 같은 새로운 TLD.

이 패턴의 단점은 이러한 문자를 여러 개 허용한다는 것입니다. 결과적으로 사용자는 유효해 보이지만 그렇지 않은 매우 긴 이메일 주소를 전달할 수 있습니다.

let pattern =
    /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

function checkEmailAddress(email_address) {
  let result = pattern.test(email_address);
  console.log(result);
}

checkEmailAddress('johndoe@citadel-consulting.com');

출력:

true

그러나 다음과 같은 유효하지 않은 이메일 주소는 이 패턴을 통과합니다.

aaa++++++++++@gmail.technologyyyyyyyyyyyyyyyyyyyyyyyyyyy.com

JavaScript에서 RFC 5322 형식으로 이메일 주소 확인

RFC 5322 형식을 준수하는 정규식 패턴을 작성할 수 있습니다. 그러나 이러한 정규식은 길이가 깁니다.

결과적으로 이해할 수 없습니다. 따라서 JavaScript에서 RegExp 클래스와 함께 속기 버전을 사용할 수 있습니다.

다음 코드에서는 RFC 5322를 준수하는 정규식 패턴을 구현했습니다. 따라서 가장 유효한 이메일 주소에 대해 true를 반환합니다.

let pattern = new RegExp(
    '([!#-\'*+/-9=?A-Z^-~-]+(\.[!#-\'*+/-9=?A-Z^-~-]+)*|"\(\[\]!#-[^-~ \t]|(\\[\t -~]))+")@([!#-\'*+/-9=?A-Z^-~-]+(\.[!#-\'*+/-9=?A-Z^-~-]+)*|\[[\t -Z^-~]*])');

function checkEmailAddress(email_address) {
  let result = pattern.test(email_address);
  console.log(result);
}

checkEmailAddress('aa@gmail.com.sa');

출력:

true

결론

이 문서에서는 전자 메일 주소의 유효성을 검사하는 다양한 정규식 패턴에 대해 설명했습니다. 그러나 그것은 모두 클라이언트 측에 있습니다.

추가 보안을 위해 서버 측에서도 이메일을 확인하시기 바랍니다.