본문 바로가기
Programming Language/Javascript

[Javascript] 정규표현식으로 url 검증하기

by 뒹굴거리는프로도 2024. 2. 20.
반응형

 

 


 

정규 표현식을 통해 웹 주소의 유효성 중, 다음 아래와 같은 내용을 검증할 수 있습니다.

1. 프로토콜 (http, https)

2. 도메인

3. 선택적 경로를 포함한 URL 유효성

 

/^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/

 

^ 문자열의 시작을 나타냅니다
(https?:\/\/)? https? : 'http'로 시작하며, 's'는 선택적입니다. 이는 URL이 'http' 또는 'https' 중 하나로 시작할 수 있음을 의미합니다.

:\/\/: ' : //' 문자열을 나타냅니다. 문자열 내에서 특수 문자 :와 /는 이스케이프 처리되어야 하므로 \를 사용합니다.

전체 괄호 () 뒤에 오는 ?는 이 전체 부분(프로토콜과 ://)이 선택적임을 의미합니다. 즉, URL에 프로토콜을 포함하지 않아도 되는 경우를 허용합니다.
([\da-z\.-]+) \d : 숫자를 나타냅니다.

a-z : 소문자 알파벳 범위를 나타냅니다.

\. : 점(.)을 나타냅니다. 점은 이스케이프 처리되어야 하므로 \가 앞에 옵니다.

- : 하이픈(-)을 나타냅니다.

이 부분은 도메인 이름의 일부로, 숫자, 소문자 알파벳, 점, 하이픈으로 구성될 수 있음을 의미합니다. +는 이 패턴이 한 번 이상 반복됨을 나타냅니다.
\. 도메인 이름과 최상위 도메인(TLD)을 구분하는 점(.)을 나타냅니다.
([a-z\.]{2,6}) 최상위 도메인(TLD)을 나타냅니다. 소문자 알파벳과 점으로 구성되며, 길이는 2에서 6 사이입니다. 이 범위는 대부분의 TLD가 이 길이에 속하기 때문에 선택되었습니다.
([\/\w \.-]*) URL의 경로 부분을 나타냅니다.

\/ : 슬래시(/)를 나타냅니다.

\w : 단어 문자(알파벳, 숫자, 밑줄)를 나타냅니다.

공백 문자를 나타냅니다 (w 우측의 공백을 말합니다. 이 부분은 정확도를 높이기 위해 수정될 수 있습니다).

. : 점(.)을 나타냅니다.

- : 하이픈(-)을 나타냅니다.

* : 이 패턴이 0번 이상 반복될 수 있음을 나타냅니다.
\/? URL이 슬래시(/)로 끝날 수 있음을 나타내며, 이는 선택적입니다.
$ 문자열의 끝을 나타냅니다. 이는 정규 표현식이 문자열의 끝까지 패턴을 매칭해야 함을 의미합니다.

 

이 정규 표현식은 URL이 프로토콜(선택적), 도메인 이름, 최상위 도메인, 그리고 선택적인 경로로 구성되어야 함을 정의합니다.

유효한 예들은 아래와 같습니다. (클릭해서 들어가지 마세요 ^^;)

기본적인 웹 주소:
http://www.example.com
https://example.com

도메인에 하위 도메인이 포함된 경우:
http://blog.example.com

경로가 포함된 URL:
https://www.example.com/path/to/page
http://example.com/a/b/c

쿼리 문자열이 포함된 URL:
http://www.example.com/?key=value
https://example.com/path?search=query

 

필요하다면 각 각의 사용 사례에 맞게 정규 표현식을 조정하거나 확장하면 됩니다.

 


 

반응형