[궁금해서 찾아본] URL을 입력하세요 - 2

Hoon Kang·2023년 3월 1일
2

궁금해서 찾아본

목록 보기
2/3
post-thumbnail

🍿 Previously On...

지난 포스트에서는 인터넷이 대략적으로 어떻게 작동하는지, DNS가 뭔지, 우리는 어떻게 검색 결과를 웹 페이지에 받아볼 수 있는지에 대해서 이야기해 보았다. 이제는 URL에 대해서 알아보도록 하자. URL과 도메인은 완전히 동일한 단어일까? 포트는 뭘까?

🗺️ 마법의 주소 URL

그렇다면 URL은 도대체 어떤 마법을 부리길래 우리를 원하는 곳으로 데려다 줄까?

URL(Uniform Resource Locator)은 인터넷 상의 특정 웹 페이지, 파일, 이미지, 동영상 등의 리소스에 접근하기 위한 주소이다.

그렇다. URL은 주소다. www.naver.com, www.google.com, www.apple.com 등이 그 예이다. 하지만 모든 URL이 다 저렇게 깔끔한 것은 아니다.

예를 들어서, 구글에 마인크래프트를 검색하면 다음과 같은 URL을 얻을 수 있다.

https://www.google.com/search?q=minecraft&oq=minecraft&aqs=chrome.0.69i59j69i60j69i61j69i60.3068j0j7&sourceid=chrome&ie=UTF-8


갑자기 익숙한 주소 뒤로 이상한 문자들이 보인다. 내가 아는 URL은 이렇지 않아! 라고 하고 싶지만, 글쎄, 역시 현실은 냉혹한 법인가보다...

...라고 생각하고 뒤를 돌기에는, 도대체 저게 뭔데? 라는 호기심이 먼저 들어버리고 말았다. 아아 안돼...지금은 새벽 두시라고...

나는 그렇게 홀린듯이 URL에 대해서 찾아보기 시작했다.

🔎 URL 뜯어보기

URL은 다음과 같은 6개의 구성요소로 이루어져 있다.

1. 프로토콜

프로토콜(Protocol) 이란 디바이스들이 네트워크 상에서 데이터를 교환하기 위한 방법 혹은 규칙들의 집합이다. 간단하게, "우리는 이 프로토콜을 따르면서 통신할거야"라고 약속을 정한 것이다. 일반적으로 URL의 시작 부분에 표시되어 있으며, 콜론과 두 개의 슬래시(://)가 붙는다.

https://www.example.com 에서 https는 프로토콜이다.

  • 프로토콜에는 HTTPS, HTTP, FTP, SSH 등이 존재한다.
  • HTTP는 Hypertext Transfer Protocol의 약자로, HTML과 같은 하이퍼미디어를 전송하기 위한 프로토콜이다.
  • HTTPS는 HTTP에 보안(Secure)을 더한 프로토콜이다. 서버와 주고받는 데이터를 암호화하기 때문에 추가적인 보호를 받을 수 있다.

2. 호스트

호스트(Host)는 내가 찾고자하는 리소스가 위치한 도메인 이름이나 서버의 IP주소이다. 일반적으로 프로토콜 뒤에 있으며, 경우에 따라 포트, 패스, 쿼리 혹은 프래그먼트 등이 뒤에 붙는다.

https://www.example.com 에서 호스트는 www.example.com 이다.

3. 패스

패스(Path)는 웹 페이지에 존재하는 리소스의 경로를 지정한다. 마치 컴퓨터에서 파일이나 폴더의 경로를 지정하듯 말이다. 주로 호스트나 포트 번호 뒤에 오며, 슬래시로 구분된다. 패스는 다양한 계층으로 구성될 수 있다.

https://www.example.com/path/to/resource.html

위와 같은 URL에서 패스는 /path/to/resource.html이다.

4. 포트

포트(Port)는 해당 서버에서 사용하는 포트 번호를 의미한다. 같은 건물이라도 3층과 5층에 위치한 시설이 다르듯, 같은 서버(건물)라도 각각의 포트(층)에서 다른 웹 서비스를 실행하고 있다. 포트는 콜론(:)으로 구분된다.

https://example.com:8080에서 포트 번호는 8080이다.

5. 쿼리

쿼리(Query)는 URL에 추가적인 정보를 제공하기 위한 매개변수이다. ?로 시작하고, 각각의 매개변수는 앰퍼샌드(&)로 구분된다. 쿼리는 한 개 이상의 키-값 쌍을 포함할 수 있다.

  • 키-값 쌍은 키 = 값의 형태로 표현된다.
  • 공백은 +로 대체된다.

    https://www.example.com/search?q=url+components&limit=10

그렇다면 위와 같은 URL에서 쿼리는 ?부터 10까지이며, 다음과 같은 키-값 쌍을 가지고 있다:

  • q = url component
  • limit = 10

6. 프래그먼트

프래그먼트(Fragment)는 해당 페이지의 특정한 리소스의 위치를 가리키는 링크를 생성할 때 사용한다. 해쉬(#)로 시작하며, 페이지의 특정 위치를 지정한다. 특정 위치를 가리키는 링크...지정...말로 하면 어려운 법이다. 예시를 통해 알아보자.

https://developer.mozilla.org/ko/docs/Web/HTTP

해당 웹 페이지는 HTTP에 관한 소개를 담고 있는 웹 페이지이다. 스크롤을 내리다 보면, "도구&리소스"라고 적힌 부분을 발견할 수 있다. 그렇다면 스크롤을 내리지 않고도 저 "도구&리소스" 부분에 접근할 수 없을까?



놀랍게도 스크롤을 하지 않았는데도 "도구&리소스"부분에 접근했다!
여러분도 한번 따라해 보도록 하자. URL의 마지막 HTTP 뒤에 #도구_리소스를 입력하면 된다.

바로 프래그먼트의 역할 덕분이다. 웹 페이지에 존재하는 특정한 리소스의 위치를 가리킨다는 것은 이것을 의미한다. 더 자세한 내용이 있는 것 같지만, 지금은 일단 이 정도만 다루도록 하자.

😯 아까 뭘 검색했다고?

자 그러면 URL이 어떻게 생긴 친구인지 대략적으로 알았으니, 아까 문제의 그 URL을 가져와 보자.

https://www.google.com/search?q=minecraft&oq=minecraft&aqs=chrome.0.69i59j69i60j69i61j69i60.3068j0j7&sourceid=chrome&ie=UTF-8

바로 이 URL이었다. 이제 여러분들은 이 URL의 구성요소를 분리할 수 있다.
안 된다고? 그럼 같이 해 보도록 하자. 다시 배운 내용을 되새겨보자.

  • 프로토콜은 ://가 뒤에 붙는다.
  • 호스트는 일반적으로 프로토콜 뒤에 나온다.
  • 패스는 /로 구분된다.
  • 쿼리는 ?로 시작하고, &로 구분된다.
  • 포트는 :로 구분된다.
  • 프래그먼트는 #로 시작한다.

아하! 그렇다면 이 URL은 포트와 프래그먼트가 보이지 않는다. 나머지 구성요소들은 다음과 같다:

  • 프로토콜: https://
  • 호스트: www.google.com
  • 패스: /search
  • 쿼리: ?q=minecraft&oq=minecraft&aqs=chrome.0.69i59j69i60j69i61j69i60.3068j0j7&sourceid=chrome&ie=UTF-8
    쿼리는 다음과 같은 키-값 쌍들을 포함하고 있다
q = minecraft
oq = minecraft
aqs = chrome.0.69i59j69i60j69i61j69i60.3068j0j7
sourceid = chrome
ie = UTF-8

🤔 URL = 도메인?

사실 혼동되긴 하지만, URL과 도메인은 완전히 같은 단어는 아니다.

도메인(Domain) 은 인터넷상의 고유한 이름을 가진 컴퓨터 혹은 서버의 주소이다.

google.com 이라는 도메인은 구글의 웹 페이지와 서비스를 제공한다.

URL 은 도메인을 포함하여 웹상의 특정 리소스의 위치를 지정한다.

https://www.google.com/search?q=url&oq=url 라는 URL은 구글의 URL 검색 결과 페이지에 접근할 수 있다.

✅ 정리하자면

  • URL은 프로토콜, 호스트, 포트, 패스, 쿼리, 프래그먼트의 여섯 가지 요소로 이루어져 있다.
  • URL과 도메인은 다르다
profile
세상의 모든 것들이 궁금한 개발자

0개의 댓글