이시안 개발 블로그

URI와 웹 브라우저 요청 흐름 본문

📡Network

URI와 웹 브라우저 요청 흐름

ICAN 2021. 12. 7. 21:11

URI와 웹 브라우저 요청 흐름

URI (Uniform Resource Identifier)

URI

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

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

URL과 URN?

URI2

  • URL : 리소스가 있는 위치를 지정
  • URN : 리소스에 이름을 부여

URN은 이름만으로 실제 리소스를 찾는 방법이 보편화 되지 않아 잘 쓰이지 않는다.

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=kouserinfo는 거의 사용하지 않음
  1. scheme
    • 주로 프로토콜 사용
    • 어떤 방식으로 자원에 접근할 것인가하는 규칙
      • http, https, ftp 등
    • http는 80 포트, https는 443 포트를 주로 사용하며 생략 가능
    • https는 http에 보안 추가 (HTTP Secure)
  2. host
    • 호스트명
    • 도메인명 또는 IP 주소를 직접 사용가능
  3. PORT
    • 접속 포트
    • 일반적으로 생략 가능
  4. path
    • 리소스 경로
    • 계층적 구조
      • /home/file1.jpg
      • /members/100
  5. query
    • key=value 형태
    • ?로 시작, &로 추가 가능
      • ?keyA=valueA&keyB=valueB
    • query parameter, query string으로 불림
  6. fragment
    • html 내부 북마크 등에 사용
    • 서버에 전송하는 정보가 아님

웹 브라우저 요청 흐름

1. HTTP 요청

HTTP 요청

사용자가 해당 URI처럼 요청을 보내면 우선 DNS 조회를 통해 IP를 가져오며 scheme 값에 따라 PORT를 지정한다. HTTP 요청 메시지는 이 때 생성하게 된다.

// HTTP 요청 메시지

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

2. HTTP 메시지 전송

HTTP 메시지 전송

애플리케이션에서 웹 브라우저가 HTTP 메시지를 생성하고 SOCKET 라이브러리를 통해 전달한다.
TCP/IP로 연결 되어 데이터를 전달하고 전달된 데이터로 HTTP 메시지를 포함한 TCP/IP 패킷을 생성하게 된다.
생성된 TCP/IP 패킷은 인터넷을 통해 서버로 전달된다.

HTTP 메시지 도착

3. HTTP 응답

HTTP 요청이 전송되면 서버에서 HTTP 응답 메시지를 보낸다.

// HTTP 응답 메시지

HTTP/1.1 200 OK
Content-Type: text/html;charset=UTF-8
Content-Length: 3423
<html>
 <body>...</body>
</html>

생성된 HTTP 응답 메시지는 응답 패킷의 데이터로 담아서 클라이언트로 보내게 된다.

HTTP 응답

응답 패킷이 도착하면 HTTP 응답 메시지의 내용을 렌더링하여 결과를 볼 수 있다.

출처: 모든 개발자를 위한 HTTP 웹 기본 지식

'📡Network' 카테고리의 다른 글

HTTP 캐시와 조건부 동작  (0) 2021.12.14
HTTP 헤더  (0) 2021.12.12
HTTP 메서드와 활용  (0) 2021.12.10
HTTP 기본  (0) 2021.12.09
인터넷 네트워크  (2) 2021.12.04
'📡Network' Related Articles more
Comments