Chapter2. URI와 웹 브라우저 요청 흐름

Date:     Updated:

카테고리:

태그:

인프런에 있는 김영한님의 모든 개발자를 위한 HTTP웹 기본 지식 강의를 듣고 정리한 내용입니다.
중간에 등장하는 ppt 내용들은 모두 강의자료를 캡처한 것입니다.


✈️ URI(Uniform Resource Identifier)

URI(Uniform Resource Identifier) 는 말 그대로 리소스를 식별하는데 필요한 규약이다. URI를 만족하는 형태로서 URLURN 이 존재한다.

URL vs URN

  • URL(Uniform Resource Locator) : 위치로 리소스를 식별
  • URN(Uniform Resource Name) : 이름으로 리소스를 식별

우리가 흔히 사용하는 URI의 형태는 리소스가 있는 위치를 지정하는 URL 방식이다. (ex. inhopp/inhopp.github.io/network) 상품의 바코드와 같이 리소스의 위치가 계속 변경되는 경우에는 위치보다는 이름을 통해 리소스를 식별하는 URN 방식이 유리할 수 있다. 다만 URN 방식은 아직 보편화 되지 않았다고 한다.

ch2 1

구글에 ‘hello’를 검색했을 때 실제로 요청하는 URL 중 하나이다.

URN 문법

scheme://[userinfo@]host[:port][/path][?query][#fragment]

scheme
scheme: //[userinfo@]host[:port][/path][?query][#fragment]
https: //www.google.com:443/search?q=hello&hl=ko

  • shceme 위치에는 http, https와 같은 프로토콜이 들어간다.
  • https = http + secure (http에 보안 추가)
  • http는 80 port, https는 433 port를 주로 사용하므로 http(s) 사용시 port는 생략이 가능하다.


userinfo
scheme: // [userinfo@] host[:port][/path][?query][#fragment]

  • 사용자 정보는 보안이 필요한 사항인데 URL에 포함하기에는 좀..
  • 실제로 userinfo는 거의 사용하지 않는다고 한다.


host
scheme: //[userinfo@] host [:port][/path][?query][#fragment]
https: // www.google.com :443/search?q=hello&hl=ko

  • host 자리에는 도메인 명 또는 IP 주소가 들어간다.


port
scheme: //[userinfo@]host [:port] [/path][?query][#fragment]
https: //www.google.com :443 /search?q=hello&hl=ko

  • 접속 포트 (일반적으로 생략)


path scheme: //[userinfo@]host[:port] [/path] [?query][#fragment]
https: //www.google.com:443 /search ?q=hello&hl=ko

  • 리소스 경로(path). 주로 계층적 구조를 띄고 있다.
  • ex) /home/items/iphone12


query
scheme: //[userinfo@]host[:port][/path] [?query] [#fragment]
https: //www.google.com:443/search ?q=hello&hl=ko

  • key=value 형태이다.
  • ?로 시작, &로 추가 가능하다.
  • query 문이 스트링 형태로 넘어가기 때문에 query parameter, query string이라고 불린다.


fragment
scheme: //[userinfo@]host[:port][/path][?query] [#fragment]

  • html 내부 북마크 등에 사용하는 정보로 서버에 전송하지는 않는다고 한다.


✈️ 웹 브라우저 요청 흐름

1. DNS 서버 조회 및 HTTP 요청 메시지 생성

ch2 2


2. 패킷 생성 - 3 way handshake 등 이 단계에서 진행

ch2 3


3. 요청 패킷 전달

ch2 4


4. 응답 패킷 전달

ch2 5


5. 응답 패킷의 메시지 내용 렌더링

ch2 6


맨 위로 이동하기

Network 카테고리 내 다른 글 보러가기

댓글 남기기