URI와 웹 브라우저 요청 흐름

LeeKyoungChang·2021년 12월 30일
0
post-thumbnail

'모든 개발자를 위한 HTTP 웹 기본 지식' 수업을 듣고 정리한 내용입니다.

 

📚 1. URI(Uniform Resource Identifier)

URI, URL, URN 세 가지의 차이점은 무엇일까?

URI(Uniform Resource Identifier)

  • Uniform : 리소스 식별하는 통일된 방식

  • Resource : 자원, URI로 식별할 수 있는 모든 것(제한 없음)

  • Identifier : 식별, 다른 항목과 구분하는데 필요한 정보

  • URI 안에는 URL(Uniform Resource Locator)과 URN(Uniform Resource Name)이 존재한다.

    • URL : Locator(위치), 리소스가 있는 위치를 지정 (위치 변경 가능)
    • URN : Name, 리소스에 이름을 부여 (이름 변경 불가능, URN 이름만으로 실제 리소스를 찾을 수 있는 방법이 보편화 되지 않음)
    • 앞으로 URI를 URL과 같은 의미로 설명한다.
  • URN은 사실상 구분하기 어렵기 때문에 거의 URL을 사용한다.

  • (URI 사진넣기)

 

URL 전체 문법

https://www.google.com/search?q=hello&hl=ko

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

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

 

(1)URL scheme

  • 주로 프로토콜 사용
  • 프로토콜 : 어떤 방식으로 자원에 접근할 것인가 하는 약속 규칙 (http, https, ftp 등등)
  • http는 80 포트, https는 443 포트를 주로 사용, 포트는 생략 가능
  • https는 http에 보안 추가 (HTTP Secure)

(2) URL userinfo

  • URL에 사용자 정보를 포함해서 인증
  • 거의 사용하지 않는다.

(3) URL host

  • 호스트명
  • 도메인명 또는 IP주소를 직접 사용가능

(4) URL PORT

  • 포트(PORT)
  • 접속 포트
  • 일반적으로 생략, 생략시 http는 80, https는 443

(5) URL path

  • 리소스 경로(path), 계층적 구조
  • ex) /home/file1.jpg, /members, /members/100, /items/iphone12

(6) URL query

  • key=value 형태
  • ?로 시작, &로 추가 기능 ?keyA=valueA&keyB=valueB
  • query parameter, query string 등으로 불림, 웹서버에 제공하는 파라미터, 문자 형태

(7) URL fragment

  • fragment
  • html 내부 북마크 등에 사용
  • 서버에 전송하는 정보 아님

 

 

📚 2. 웹 브라우저 요청 흐름

사진1

(1) 요청을 보낼 서버를 알아야 하니, 먼저 DNS 서버를 조회해서 IP와 PORT 번호를 조회한다.

(2) HTTP 요청 메세지를 생성한다.

  • GET /search?q=hello&hl=ko HTTP/1.1
  • Host: www.google.com

사진2

(3) HTTP 메세지를 SOCKET 라이브러리를 통해 OS 계층인 TCP/IP 계층에 전달을 한다.

  • 이때, 3-way handshake 를 통해 서버와 연결을 확인하고 데이터를 전달한다.

사진3

(4) TCP/IP 계층에서는 이전의 웹 브라우저에서 전달 받은 데이터를 기반으로 TCP/IP 패킷을 생성한다.

사진4

사진5

(5) 네트워크 인터페이스 계층을 거쳐 서버로 전송된다.

(6) 서버는 전달 받은 데이터를 분석하고, HTTP 응답 메세지를

생성한다.

  • HTTP 응답 메세지 형태 : 응답 코드, 응답 데이터의 형태와 언어, 데이터의 길이, 실제 응답 데이터 등이 들어있다. (뒤에서 구체적으로 공부하게 된다.)

사진9

(7) 서버도 위와 같은 방식으로 응답 패킷을 만들어서 클라이언트에게 패킷을 전달한다.

사진6

사진7

(8) 클라이언트는 응답 패킷을 분석하고, 웹 브라우저가 렌더링해서 화면에 뿌려준다.

사진8

 

 


참고

profile
"야, (오류 만났어?) 너두 (해결) 할 수 있어"

0개의 댓글