[ 김영한 모든 개발자를 위한 HTTP 웹 기본 지식 #2 ] URI와 웹 브라우저 요청 흐름

이번 섹션에서는 URI와 웹 브라우저 요청 흐름에 대해서 알아보자.

👉 목차는 다음과 같다.

1) URI
2) 웹 브라우저 요청 흐름

---

1) URI(Uniform Resource Identifier)

• URI ? URL ? URN ?
  • URI는 로케이터(locator), 이름(name) 또는 둘 다 추가로 분류될 수 있다.
    

• URI 단어 뜻
  • Uniform: 리소스를 식별하는 통일된 방식
  • Resource: 자원, URI로 식별할 수 있는 모든 것(제한 없음)
  • Identifier: 다른 항목과 구분하는데 필요한 정보

• URL, URN 단어 뜻

  • URL - Locator: 리소스가 있는 위치를 지정
  • URN - Name: 리소스에 이름을 부여
  • 위치는 변할 수 있지만, 이름은 변하지 않는다.
  • urn:isbn:8960777331 (어떤 책의 isbn URN)
  • URN 이름만으로 실제 리소스를 찾을 수 있는 방법이 보편화 되지 않음
  • 앞으로 URI를 URL과 같은 의미로 이야기하겠다

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

  • 프로토콜(https)
  • 호스트명(www.google.com)
  • 포트번호(443)
  • 패스(/search)
  • 쿼리 파라미터(q=hello&hl=ko)

• URL - scheme
  scheme://[userinfo@]host[:port][/path][?query][#fragment]
  https://www.google.com:443/search?q=hello&hl=ko
  • 주로 프로토콜 사용
  • 프로토콜: 어떤 방식으로 자원에 접근할 것인가 하는 약속 규칙
    • ex) http, https, ftp 등등
  • http는 80포트, https는 443포트를 주로 사용, 포트는 생략가능.
  • https는 http에 보안 추가 (HTTP Secure)

• URL - userinfo
  scheme://[userinfo@]host[:port][/path][?query][#fragment]
  https://www.google.com:443/search?q=hello&hl=ko
  • URL에 사용자 정보를 포함해서 인증
  • 거의 사용하지 않는다.

• URL - host
  scheme://[userinfo@]host[:port][/path][?query][#fragment]
  ex) https://www.google.com:443/search?q=hello&hl=ko
  • 호스트명
  • 도메인명 또는 IP 주소를 직접 사용 가능

• URL - PORT
  scheme://[userinfo@]host[:port][/path][?query][#fragment]
  ex) https://www.google.com:443/search?q=hello&hl=ko
  • 포트(PORT)
  • 접속 포트
  • 일반적으로 생략, 생략시 http는 80, https는 443

• URL - path
  scheme://[userinfo@]host[:port][/path][?query][#fragment]
  ex) https://www.google.com:443/search?q=hello&hl=ko
  • 리소스가 있는 경로(path), 계층적 구조
  • ex) /home/file1.jpg, /members, /members/100

• URL - query
  scheme://[userinfo@]host[:port][/path][?query][#fragment]
  ex) https://www.google.com:443/search?q=hello&hl=ko
  • key=value 형태
  • ?로 시작, &로 추가 가능 ( ex. ?keyA=valueA&keyB=valueB )
  • query parameter, query string 등으로 불린다. 웹서버에 제공하는 파라미터, 문자 형태

• URL - fragment
  scheme://[userinfo@]host[:port][/path][?query][#fragment]
  ex) https://docs.spring.io/spring-boot/docs/current/reference/html/getting-started.html#getting-started.introducing-spring-boot
  • fragment
  • html 내부 북마크 등에 사용
  • 서버에 전송하는 정보 아님

---

2) 웹 브라우저 요청 흐름

• 아래 URL을 웹브라우저에 입력하여 요청했다고 가정하자.
  

• 웹 브라우저에 입력된 URL 정보로부터 IP, PORT 정보를 얻고 웹브라우저가 HTTP 요청 메시지를 생성한다.
  

• HTTP 요청 메시지는 간략히 보면, 다음과 같은 형태로 만들어진다.
  
• HTTP 메시지 전송
  
  • 웹 브라우저가 HTTP 요청 메시지를 생성한다.
  • SOCKET 라이브러리를 통해 TCP/IP로 3 way handshake를 실행해 서버와 연결한다.
  • 운영체제 TCP/IP 계층으로 데이터 전송을 하기 위해 데이터를 전달한다.
  • HTTP 메시지가 포함된 TCP/IP 패킷을 생성한다.
  • 해당 패킷 정보가 인터넷으로 흘러가게 되고, 수많은 노드를 통해서 서버에 전달된다.

• 이렇게 요청 패킷이 도착하고 나면, 서버는 도착한 패킷의 데이터 부분(HTTP 요청 메시지)를 해석한다. 이후 HTTP 응답 데이터를 생성한다.
  • 대략적인 HTTP 응답 메시지는 다음과 같다.
    
  • 서버도 응답 패킷을 만들고 클라이언트에 전달한다.
    
    • 서버는 도착한 패킷의 데이터 부분(HTTP 요청 메시지)를 해석한다. 이후 HTTP 응답 데이터를 생성한다.
    • HTTP 메시지가 포함된 TCP/IP 패킷을 생성한다.
    • 인터넷 망을 통해 응답 패킷을 클라이언트에 전달한다.
    • 웹 브라우저는 수신한 응답 패킷의 HTTP 응답 메시지를 꺼내고, 해당 메시지에 있는 HTML을 렌더링해서 보여준다.

---

강의를 듣고 정리한 글입니다. 코드와 그림 등의 출처는 김영한 강사님께 있습니다.