[JS] 정규표현식으로 URL 검증하기 [간단한 형태의 URL을 체크하는 정규표현식 만들기]

---

- 정규표현식으로 URL 검증하기

URL을 체크하기 위한 정규표현식은 다양한 형식의 URL을 모두 고려하여야 한다.
다음은 간단한 형태의 URL을 체크하는 정규표현식이다.

const urlRegex = /^(http|https):\/\/[\w\-]+(\.[\w\-]+)+[/#?]?.*$/;

이 정규표현식은 다음과 같은 URL 형식을 허용한다.

• http:// 또는 https://로 시작하는 URL
• 도메인 이름 (예: example.com)
• 옵션: 경로, 쿼리 문자열, fragment 등

---

- 정규표현식에 대한 설명

1) ^(http|https)

URL은 "http://" 또는 "https://"로 시작해야 한다. 이 부분은 "http" 또는 "https" 문자열을 나타내며, "|"를 사용하여 둘 중 하나를 선택할 수 있도록 한다.

2) :\/\/

URL에서 "://" 문자열을 나타낸다. 이 부분은 "http://" 또는 "https://" 다음에 오는 "://" 문자열을 의미한다.

3) [\w\-]+

URL에서 도메인 이름을 나타낸다. 여기서 \w는 단어 문자를 의미하며, [a-zA-Z0-9_]와 동일하다. \w 다음에 나오는 "+"는 한 개 이상의 단어 문자가 있어야 함을 나타내며 -는 하이픈을 나타낸다.

4) (\.[\w\-]+)+

도메인 이름의 나머지 부분을 처리한다. "."으로 시작하고 단어 문자와 하이픈으로 이루어진 문자열이 하나 이상 나와야 한다. 여기서 "+"는 이 부분이 한 번 이상 반복될 수 있음을 나타낸다.

5) [/#?]?

URL에서 경로, 쿼리 문자열 또는 fragment를 나타내는 부분이다. "/#", "?", 또는 그것들의 조합이 URL에 있을 수 있음을 나타낸다. "?" 뒤에 오는 문자열은 쿼리 문자열을 의미하며, "#" 뒤에 오는 문자열은 fragment를 의미한다. 이 부분이 "?"나 "#"으로 시작하지 않을 수도 있으므로 "?"와 "#" 앞에 "?"가 붙어 있다.

6) .*$

URL의 나머지 부분을 처리한다. URL의 끝에 다른 문자열이 나올 수도 있고 나오지 않을 수도 있다.

---

따라서 이 정규표현식은 "http://" 또는 "https://"로 시작하고, 유효한 도메인 이름을 포함하며, 선택적으로 경로, 쿼리 문자열, fragment를 가질 수 있는 URL을 검증한다.

---