Medium - A Basic Interview Question; Can You Explain Every Part of a URL?
in Trend
Trend 파악을 위한 Medium 기고문 포스팅 - 기본적인 인터뷰 질문; 여러분은 URL의 모든 부분을 설명할 수 있나요? 조각조각 떼어봅시다.
(Photo by Bianca Castillo on Unsplash)
새로운 웹서비스 광고가 여러분의 이목을 사로잡습니다. 여러분은 폰에 잠금을 풀고 좋아하는 인터넷 브라우저를 켠다음 여러분이 기억할 수 있는대로 URL을 입력합니다. (여러분의 폰에 따라 다르겠지만) 잠시후에 새로운 웹 페이지가 여러분의 눈앞에 펼쳐집니다. 이것은 아주 오래전 ( 최소한 1990년대 후반 )의 이야기지만 여러분은 어떻게 URL의 부분이 동작하는지 설명하실 수 있나요? 웹 개발자가 되고 싶으시다면 이것은 여러분이 반드시 알아야 할 기본적인 지식입니다. 얼른 알아봅시다.
What is a URL?
URL은 Uniform Resource Locator ( 자원 표시 형식 )의 앞글자만 따온 것입니다. 이름에서 알 수 있듯이 URL은 웹과 서버에 있는 고유한 자원의 특정 위치를 나타내는 것으로 브라우저와 같은 도구가 조회하기 위해 사용하는 위치입니다. URL들은 일반적으로 도시의 주소에 비교되곤 합니다. 각 섹션의 URL들은 다른 주소에 있는 것을 제공하며 다른 정보들을 나타냅니다. 아래의 예제 URL을 참고해서 하나씩 살펴봅시다.
https://www.pickles.com:80/pickles/index.html?type=sweet&size=small#Summertime_Sweet_Pickles
Scheme
http://
: 이것은 스키마로 브라우저가 URL의 데이터를 요청할 때 어떤 프로토콜을 사용할지 나타내는 것입니다. (프로토콜은 인터넷으로 데이터를 전달하는 규칙입니다.) 여러가지 스키마가 잇지만 http ( SSL이 없음 ), https ( SSL ) 이 가장 많이 쓰이며 민감한 데이터를 다루는 프로토콜은 보안이 강화된 버전의 HTTP를 사용합니다. :
콜론은 스키마 구분자이며 앞에 있는 두개의 슬래쉬 //
들은 도메인 이름이 시작함을 알려줍니다.
Domain Name
www.pickles.com
: 이것은 도메인 이름으로 ( 호스트라고도 합니다 ) 호스트를 나타내거나 요청이 전달될 웹서버를 가리킵니다. 기간에 따라 구분된 호스트 이름의 각 컴포넌트들을 도메인이라고 합니다. 오른쪽의 (.com)은 도메인 접미사, 최상단 도메인이고 왼쪽의 도메인 (www.)은 두번째 레벨의 도메인 혹은 서브 도메인이라고 합니다. 도메인 접미사는 .org, .net, .gov.au와 같이 매우 다양합니다.
Port
:80
: 이것은 포트번호로 웹 서버의 자원에 접근할 때 사용할 게이트를 가리킵니다. 브라우저가 서버와 접촉할 때 아마 well-known 포터 번호를 사용할 것입니다. well-known 포트번호는 인터넷 프로토콜을 목적으로 할당된 포트번호입니다. 예를들어 HTTP 표준 포트번호는 80번이고 ( HTTPS는 443 ) 표준 포트번호를 사용한다면 이 부분은 URL에서 대개 생략됩니다. 그렇지 않으면 반드시 포트번호가 명시되어야 합니다. 여기서도 콜론은 구분자 역할을 합니다.
Path
/pickles/index.html
: 이것은 경로로써 브라우저가 접근하고 싶어하는 서버의 자원까지의 경로를 나타냅니다. 슬래쉬는 URL을 계층적인 구조로 관리하기 위한 구분자로 사용됩니다.
Query String
?type=sweet&size=small
: 이것은 질의문으로 항상 ?
물음표로 시작합니다. 그리고 뒤에 오는 1개 이상의 파라미터들은 서버에게 전달되며 특정 값을 돌려받기 위해 사용됩니다. 매개변수들은 대개 키/밸류 짝으로 (type=sweet) 심볼들과 &
엠퍼센트로 구분됩니다 (&size=small). 모든 웹 서버는 자신만의 고유한 규칙에 따라 전달받은 매개변수를 처리합니다.
Anchor
#Summertime_Sweet_Pickles
: 이것은 앵커라고 불리는 것으로 프래그먼트 구분자라고 불리며 #
으로 항상 시작합니다. 이것은 URL에 앵커가 있다면 사용자가 받게될 웹페이지의 위치를 나타냅니다. 만약 URL이 HTML 페이지를 조회하는 것이라면 프래그먼트 구분자는 하위 영역의 일치하는 아이디를 사용해서 페이지의 하위 영역을 나타내는데 사용할 수 있습니다.
Putting it All Together
모든 URL이 위에 설명드린 것처럼 모든 요소들을 담고있는 것은 아니지만 URL을 구성하는 핵심요소기는 합니다. 각 라벨들은 영역을 대표하는 것으로 적절한 구분자를 사용해서 URL을 시각화 한다면 다음과 같을 것입니다.
scheme://domain:port/path?query=string#anchor
URL에 관한 다른 영역과 규칙들이 있지만 이정도면 가장 일반적으로 볼 수 있는 URL 구성요소들이며 여러분이 설명가능해야 할 겁니다. 인터뷰 잘보세요
Summary
- URL의 구성요소 분석
- scheme은 프로토콜 방식이다. http, https, ftp 등
- www.은 서브 도메인이고 중간 부분은 host, server를 나타내며 우측의 .com은 최상단 도메인이다.
- port http의 경우 일반적으로 80번을 쓰며 그럴경우 생략이 가능하다. 그렇지 않다면 반드시 명시해야 한다
- path 경로는 해당 서버/호스트에 특정 자원까지의 경로를 나타낸다. 중간에 슬래쉬는 경로를 계층 구조로 관리하기 위함이다
- QueryString은 해당 경로의 자원에 대해서 매개변수를 넘겨줘서 서버 고유한 방식으로 처리할 수 있게끔 하는 것이다
- 앵커는 현재 자원의 위치를 나타내는 것으로 HTML 페이지를 조회할 때 하위 영역을 그릴 때 사용할 수 있다.