Programing/javascript

URL 형식 유효성 검사 함수

2025. 4. 22. 08:00
반응형

사용자가 입력한 문자열이 실제로 유효한 도메인 혹은 URL인지 판단하는 기능은 웹 서비스에서 매우 중요합니다. 예를 들어, 링크 등록 기능이나 외부 사이트 연결 기능을 제공할 때, 형식이 잘못된 주소를 사전에 걸러내는 것이 사용자 경험 및 보안 측면에서 매우 중요합니다.

이 글에서는 URL 형식을 검사하는 JavaScript 함수 checkUrlFormat의 구조와 동작 원리를 살펴보겠습니다.


✨ 함수 코드 원문

function checkUrlFormat(url) {
    try {
        const parsed = new URL(url.startsWith('http') ? url : `https://${url}`);
        return /^[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)+$/.test(parsed.hostname);
    } catch {
        return false;
    }
}

✨ 핵심 동작 설명

1. URL 객체로 파싱 시도

const parsed = new URL(url.startsWith('http') ? url : `https://${url}`);
  • 입력값 url이 http로 시작하지 않으면 자동으로 https://를 붙여 URL 객체로 파싱합니다.
  • URL 클래스는 브라우저와 Node.js 모두에서 사용할 수 있는 내장 객체로, 유효하지 않은 주소라면 예외가 발생합니다.

2. 도메인(hostname) 유효성 검사

/^[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)+$/.test(parsed.hostname)
  • parsed.hostname에 대해 정규표현식을 적용합니다.
  • 이 정규식은 일반적인 도메인 형식(예: example.com, sub.domain.co.kr)을 허용합니다.
  • 도메인은 문자, 숫자, 하이픈(-)으로 구성되고, 최소 하나 이상의 점(.)으로 구분되어야 합니다.

3. 예외 처리

catch {
    return false;
}
  • URL 파싱 중 오류가 발생하면 false를 반환합니다. 즉, 잘못된 형식의 입력값입니다.

✨ 사용 예시

checkUrlFormat('example.com');           // true → 정상적인 도메인 형식
checkUrlFormat('http://example.com');    // true → 프로토콜 포함된 도메인 형식
checkUrlFormat('https://abc.def.co.kr'); // true → 서브도메인을 포함한 정규 도메인
checkUrlFormat('invalid_url');           // false → URL 객체로 파싱은 가능하지만 hostname이 'invalid_url'로, 도메인 형식(점 포함)이 아님
checkUrlFormat('http://');               // false → URL 객체로 파싱 중 예외 발생 (호스트가 없음)
checkUrlFormat('just text');             // false → URL 객체로 파싱은 되지만 도메인 형식 정규식에 불일치

 


✅ 도메인 이름 규칙 (RFC 기준)

도메인 이름(호스트네임)은 RFC 952 및 RFC 1123에 따라 다음과 같은 규칙을 가집니다:

📌 허용되는 문자

  • 영문자 a-z (대소문자 구분 없음)
  • 숫자 0-9
  • 하이픈 - (단, 앞/뒤에 올 수 없음)
  • 밑줄 _은 허용되지 않음

❌ 허용되지 않는 것들

  • 밑줄 _
  • 특수문자 !, @, #, 등
  • 공백 문자
  • 한글 등 유니코드 문자 (punycode로 변환된 IDN은 예외)

 


✨ 활용 팁

  • 사용자가 입력한 URL에서 프로토콜이 없더라도 자동으로 붙여 처리 가능
  • 실제 도메인 존재 여부를 확인하지는 않지만 형식 검사는 신뢰할 수 있음
  • 필요에 따라 localhost 또는 IP 주소를 허용하도록 정규식 수정 가능

✨ 결론

checkUrlFormat 함수는 URL 형식을 단순하고 안전하게 검증할 수 있는 실용적인 유틸리티입니다. URL 객체를 활용한 파싱과 정규표현식을 결합함으로써 신뢰도 높은 형식 검사를 수행할 수 있으며, 프론트엔드와 백엔드 모두에서 활용하기 적합합니다.

 
반응형

'Programing > javascript' 카테고리의 다른 글

윤년 기준으로 날짜 선택 옵션을 자동 변경하는 함수  (0) 2025.04.22
생년월일 유효성 검사 함수  (0) 2025.04.22
날짜 범위 형식 유효성 검사 함수  (1) 2025.04.22
날짜 형식 유효성 검사 함수  (0) 2025.04.22
휴대폰 번호 유효성 검사 JavaScript  (1) 2025.04.21
긴 문자열 중간 생략을 위한 JavaScript 함수  (0) 2025.04.21
금액을 10원 단위로 반올림, 올림, 내림하는 JavaScript  (0) 2025.04.21
이메일 입력 필드를 위한 한글 및 공백 제거 jQuery  (0) 2025.04.21
'Programing/javascript' 카테고리의 다른 글
  • 날짜 범위 형식 유효성 검사 함수
  • 날짜 형식 유효성 검사 함수
  • 휴대폰 번호 유효성 검사 JavaScript
  • 긴 문자열 중간 생략을 위한 JavaScript 함수
Dongkkase
Dongkkase
개발자로 일하면서 부딪히는 문제풀이가 누군가에게 도움이 되길 바라며
    반응형
  • Dongkkase
    정집사의 개발로그
    Dongkkase
  • 전체
    오늘
    어제
    • All (469) N
      • 금융 (61)
      • Programing (289) N
        • Algorithm (39)
        • API (2)
        • javascript (121)
        • CSS (8)
        • HTML (10)
        • PHP (15)
        • JAVA (27)
        • JSP (17)
        • JSP 예제 (1)
        • IOS (1)
        • Android (1)
        • Sencha Touche (1)
        • bat file, cmd (0)
        • 디버깅 (2)
        • SQL (17)
        • MS-SQL (1)
        • MySQL (12)
        • 보안 (5) N
      • Server (14)
        • Docker (1)
        • Windows (9)
        • Linux (3)
        • jeus (1)
      • Database (6)
      • IT 일반 (15)
      • 리뷰 (38)
        • Book (17)
        • 제품 (2)
        • 영화 소개 (11)
        • 음악 소개 (7)
      • 잡생각 (33) N
        • 회고 (3)
        • 컬럼 (1) N
        • 자료실 (6)
        • 낙서장 (12)
        • 위시리스트 (2)
        • WOW (1)
        • 덕 (1)
  • 인기 글

  • 최근 댓글

  • 태그

    IT블로그
    블로그
    읽고 싶은 책
    js패턴
    IT 관련
    It
    JavaScript
    사고 싶은 책
    디자인패턴
    자바스크립트유틸
    jsp
    자바
    SQL
    php
    Java
    IT·컴퓨터
    위시리스트
    iT's MY LiFE
    자바스크립트
    기초
Dongkkase
URL 형식 유효성 검사 함수
상단으로

티스토리툴바