203. (TWOK/WORK) [업무 이슈] 사용자 로그인 이메일 형식에서 도메인에 . 점이 2개 이상이 되는 경우 유효성 검증 실패 이슈 문의

---

[제 목]

​

타이틀 : 투케이 / 2k / 업무 정리

​

제목 : [업무 이슈] 사용자 로그인 이메일 형식에서 도메인에 . 점이 2개 이상이 되는 경우 유효성 검증 실패 이슈 문의

​

 

---

[내 용]

​

------------------------------------------------------------------------------
[개발 및 테스트 환경]
------------------------------------------------------------------------------

- 제 목 : [업무 이슈] 사용자 로그인 이메일 형식에서 도메인에 . 점이 2개 이상이 되는 경우 유효성 검증 실패 이슈 문의


- 테스트 환경 : Web / Login / Email Validation


- 사전) 도메인 (Domain) 간략 설명 정리 : 

  >> 도메인은 인터넷상에서 특정 웹사이트, 이메일 서버 등으로 접근하기 위해 사용하는 문자 기반 주소입니다.

    - 예시 : google.com
    - 예시 : naver.com
    - 예시 : example.org
    - 예시 : mycompany.co.kr

  >> 실제 컴퓨터는 IP 주소 (예: 142.251.42.14) 로 되어있으며, DNS 서버가 도메인을 IP 주소로 변환해주는 역할을 합니다.

  >> 도메인은 점(.) 으로 구분된 여러 계층(level)으로 구성됩니다. (예시 : www.google.com)

    - www : 서브도메인(Subdomain) : 특정 서비스나 지역/섹션을 구분할 때 사용
    - google : 2차 도메인(Second-level domain, SLD) : 회사나 기관을 대표하는 고유한 이름
    - com : 최상위 도메인(Top-level domain, TLD) : 도메인 최상위 분류 (.com, .net, .kr 등)

------------------------------------------------------------------------------





------------------------------------------------------------------------------
[이슈 사항]
------------------------------------------------------------------------------

1. 웹 페이지에서 회원 가입 후 로그인 수행 시 이메일 형식 유효성 체크 부분에서 도메인 부분에 . (점) 이 2개 이상 포함 되어 있어 로그인이 실패하는 이슈 문의


2. ⚠️ 기존 이메일 형식 유효성 검증 정규식 : 

  >> const emailRegExp = /^[A-Za-z0-9._%+-]+@(?:[A-Za-z0-9_-]+\.){1}[A-Za-z]{2,}$/;

  >> (?:[A-Za-z0-9-]+\.){1} : 도메인 라벨 + 점(.) 이 1번만 허용 (twok@example.com)

------------------------------------------------------------------------------





------------------------------------------------------------------------------
[원인 파악 및 증상 재현]
------------------------------------------------------------------------------

1. 웹 페이지 회원 가입 시 이메일 형식에서 . (점) 다중 지정 설정 및 회원 가입 수행

  >> 이메일 형식 : twok@sub.example.com


2. 웹 페이지 로그인 수행 시 설정한 이메일 형식 아이디로 로그인 수행 실시


3. 웹 페이지에서 '❌ 올바르지 않은 이메일 형식 입니다.' 알림 팝업창 표시 확인

------------------------------------------------------------------------------






------------------------------------------------------------------------------
[조치 내용]
------------------------------------------------------------------------------

1. 웹 페이지에서 로그인 수행 시 이메일 형식 유효성 검증 정규식 수정 진행

  >> AS-IS : 기존 도메인 뒤에 . (점) 이 하나만 포함되어야한다

  >> TO-BE : 도메인 뒤에 . (점) 이 하나 또는 두개도 허용 처리 한다


2. 자바스크립트 정규식 체크 예시 코드 첨부 : 

  // -------------------------------------
  // 이메일 검증을 하기 위한 샘플 데이터 선언
  // ------------------------------------- 
  const emailArray = [            
    "twok@example.com",           // ✅ 점 1개
    "twok@sub.example.com",       // ✅ 점 2개              
    "twok@sub.example.test.com",  // ❌ 점 3개
    "twok@sub..example.com",      // ❌ 연속 점
    "twok@sub.example.c",         // ❌ (TLD 1 글자 / com, kr, museum 형식이 되어야함)
  ];


  // -------------------------------------
  // ✅ test() 함수를 사용해 문자열이 해당 정규식 패턴과 일치하는지 (true/false) 검증 수행
  // -------------------------------------            
  emailArray.forEach(s => {

    if (emailRegExp.test(s) == true){
      console.log(`✅ email : ${s} / return : ${emailRegExp.test(s)}`);
    }
    else {
      console.log(`❌ email : ${s} / return : ${emailRegExp.test(s)}`);
    }
    
  });


  // -------------------------------------
  // 로그 출력 샘플 첨부
  // -------------------------------------
  /*
  ✅ email : twok@example.com / return : true
  ✅ email : twok@sub.example.com / return : true
  ❌ email : twok@sub.example.test.com / return : false
  ❌ email : twok@sub..example.com / return : false
  ❌ email : twok@sub.example.c / return : false
  */
  // -------------------------------------

------------------------------------------------------------------------------





------------------------------------------------------------------------------
[참고 사이트]
------------------------------------------------------------------------------

(java/자바) [유틸 파일] : getRegExpDetail 정규식 패턴 형식 검증 - 휴대폰 번호, 이메일, 주민번호, ip주소 등

https://kkh0977.tistory.com/4345

https://blog.naver.com/kkh0977/223143798563?trackingCode=blog_bloghome_searchlist


[Mac Os] [validator] : String 문자열 유효성 검증 모듈 사용해 Email 이메일 유효성 검증 - isEmail

https://kkh0977.tistory.com/5334

https://blog.naver.com/kkh0977/223342853687?trackingCode=blog_bloghome_searchlist


[라이브러리] [Web] [npm] validator 문자열 (String) 유효성 검증 라이브러리

https://kkh0977.tistory.com/5350

https://blog.naver.com/kkh0977/223343528525?trackingCode=blog_bloghome_searchlist

------------------------------------------------------------------------------

 

---

[참고 사이트]

​

https://kkh0977.tistory.com/5334

144. (NodeJs) [Mac Os] [validator] : String 문자열 유효성 검증 모듈 사용해 Email 이메일 유효성 검증 - isEma

---