[JS] 개인정보 마스킹 함수 (이름, 이메일, 전화번호)

 

프론트엔드에서 데이터를 마스킹할 일은 흔치 않을 거라고 생각하지만, 

한번 더 마스킹 처리가 필요할 때 꺼내쓰기 용이한 함수이다.

 

기본적인 부분이 처리되어 있고,

요구사항에 따라 메소드 내부 조건문을 추가하거나,

새로운 메소드를 추가하면 두고두고 용이하게 사용할 수 있을 것 같다.

 

export const maskingFunc = {
	checkNull: str => typeof str === 'string' ? !str.trim() : !str,
	/*
	※ 이메일 마스킹
	ex1) 원본 데이터 : abcdefg12345@kakao.com
		 변경 데이터 : abcd********@kakao.com
	*/
	email: function(str){
		const originStr = str;
		const emailStr = originStr.match(/([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.[a-zA-Z0-9._-]+)/gi);

		if(this.checkNull(originStr) || !!this.checkNull(emailStr)){
			return originStr;
		}else{
			const strLength = emailStr.toString().split('@')[0].length - 5;
			return originStr.toString().replace(new RegExp('.(?=.{0,' + strLength + '}@)', 'g'), '*');
		}
	},
	/* 
	※ 휴대폰 번호 마스킹
	ex1) 원본 데이터 : 01012345678, 변경 데이터 : 010****5678
	ex2) 원본 데이터 : 010-1234-5678, 변경 데이터 : 010-****-5678
	ex3) 원본 데이터 : 0111234567, 변경 데이터 : 011***4567
	ex4) 원본 데이터 : 051-123-4567, 변경 데이터 : 051-***-4567
	*/
	phone : function(str){
		const originStr = str;
		let maskingStr;
		
		if(!!this.checkNull(originStr)){
			return originStr;
		}
		
		if (originStr.toString().split('-').length != 3) { 
        	// 1) -가 없는 경우
			const phoneStr = originStr.length < 11 ? originStr.match(/\d{10}/gi) : originStr.match(/\d{11}/gi);

			if(!! this.checkNull(phoneStr)){
				return originStr;
			}
			if(originStr.length < 11) { 
            	// 1.1) 0110000000
				return originStr.toString().replace(phoneStr, phoneStr.toString().replace(/(\d{3})(\d{3})(\d{4})/gi,'$1***$3'));
			} else { 
            	// 1.2) 01000000000
				return originStr.toString().replace(phoneStr, phoneStr.toString().replace(/(\d{3})(\d{4})(\d{4})/gi,'$1****$3'));
			}
		}else { 
        	// 2) -가 있는 경우
			const phoneStr = originStr.match(/\d{2,3}-\d{3,4}-\d{4}/gi);

			if(!!this.checkNull(phoneStr)){
				return originStr;
			}
			
			if(/-[0-9]{3}-/.test(phoneStr)) { 
            	// 2.1) 00-000-0000
				return originStr.toString().replace(phoneStr, phoneStr.toString().replace(/-[0-9]{3}-/g, "-***-"));
			} else if(/-[0-9]{4}-/.test(phoneStr)) { 
            	// 2.2) 00-0000-0000
				return originStr.toString().replace(phoneStr, phoneStr.toString().replace(/-[0-9]{4}-/g, "-****-"));
			}
		}
	},
	/*
	※ 이름 마스킹
	ex1) 원본 데이터 : 비빔밥, 변경 데이터 : 비*밥
    ex2) 원본 데이터 : 김밥, 변경 데이터 : 김*
	*/
	name : function(str){
		const originStr = str;
		
		if(!!this.checkNull(originStr)){
			return originStr;
		}
		
		const strLength = originStr.length;
		
        if (strLength === 2) {
          return `${originStr[0]}*`
        } else if (strLength < 2) {
          return originStr;
        } else if (strLength <= 4) {
          return originStr[0] + '*'.repeat(strLength - 2) + originStr[strLength - 1];
        } else {
          return originStr.slice(0, 2) + '*'.repeat(strLength - 4) + originStr.slice(strLength - 2);
        } 
	}
}