[HTTP] URI와 웹 브라우저 요청 흐름

2024. 9. 3. 01:44·Back-End/HTTP

[작성일: 2023. 09. 03]

 

 

URI(=URL)

  • URI(Uniform Resource Identifier)
    • Uniform: 리소스를 식별하는 통일된 방식
    • Resource: 자원, URI로 식별할 수 있는 모든 것(제한 없음)
    • Identifier: 다른 항목과 구분하는데 필요한 정보
  • URI는 로케이터(locator), 이름(name) 또는 둘 다 추가로 분류될 수 있다.

출처: 김영한님

 

참고
URL: Uniform Resource Locator, 리소스가 있는 위치를 지정
URN: Uniform Resource Name, 리소스에 이름을 부여, 이름만으로 실제 리소스를 찾을 수 있는 방법이 보편화되지 않음.
위치는 변할 수 있지만 이름은 변하지 않는다.
urn:isbn:8960777331(어떤 책의 isbn URN)

 

 

 

 

URL 전체 문법

 

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

 

 

위의 주소를 분석해보자. 

 

 

URL scheme

  • scheme://[userinfo@]host[:port][/path][?query][#fragment]
  • https://www.google.com:443/search?q=hello&hl=ko 
    • 주로 프로토콜을 사용한다.(https)
    • 프로토콜이란 어떤 방식으로 자원에 접근할 것인가 약속하는 규칙으로 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]
  • https://www.google.com:443/search?q=hello&hl=ko
    • 호스트명
    • 도메인 명 또는 IP 주소를 직접 사용가능하다.

 

 

URL PORT

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

 

 

URL path

  • scheme://[userinfo@]host[:port][/path][?query][#fragment]
  • https://www.google.com:443/search?q=hello&hl=ko
    • 리소스 경로(path)이며 계층적 구조를 가진다.
    • /home/file1.jpg
    • /members
    • /members/100, /items/iphone12 등

 

 

URL query

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

 

 

URL fragment

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

 

 

 

 

 

웹 브라우저 요청 흐름

웹 브라우저는 구글 서버를 찾고 DNS를 조회하고 IP와 PORT정보를 찾고 http 요청 메시지를 생성한다.

출처: 김영한님

 

HTTP 요청 메시지는,

GET /search?q=hello&hl=ko

HTTP/1.1 Host: www.google.com

 

출처: 김영한님

 

웹브라우저가 HTTP 메시지를 생성하고 소켓 라이브러리를 통해 TCP/IP 계층에 전달한다.

TCP/IP는 패킷을 생성하고 HTTP 메시지를 포함해서 인터넷으로 흘러가게 된다.

수많은 인터넷 노드를 통해 구글 서버에 전달되고, 요청 패킷이 도착하면 HTTP 메시지만 꺼내서 해석한다.

 

출처: 김영한님

 

서버에서는 HTTP 응답 메시지를 만들어낸다.

 

HTTP/1.1 200 OK

Content-Type: text/html;charset=UTF-8

Content-Length: 3423

<html> ... </html>

 

출처: 김영한님

 

웹 브라우저에 응답 패킷이 도착하면 HTML 렌더링을 하면 우리는 그 웹브라우저 HTML을 볼 수 있다.

 

 

 

 

 

 

 

 

 

 


🐣 출처: 인프런 김영한님 강의

 

이 글은 인프런의 김영한님 HTTP 웹 강의를 보고 작성한 글입니다.

강의를 들으면서 정리한 글이므로 틀린 내용이나 오타가 있을 수 있습니다.

 

저작자표시 비영리 변경금지 (새창열림)
'Back-End/HTTP' 카테고리의 다른 글
  • [HTTP] HTTP 메서드 활용
  • [HTTP] HTTP 메서드
  • [HTTP] HTTP
  • [HTTP] 인터넷 네트워크
뚜비
뚜비
1년차 백엔드&iOS 개발자의 감자 탈출 블로그 🥔🥔
  • 뚜비
    뚜비의 개발로그
    뚜비
  • 전체
    오늘
    어제
  • 글쓰기     관리
    • Devlog
      • Back-End
        • Java
        • Spring
        • JPA
        • HTTP
        • Security
        • Back-End
        • Front-End
      • 알고리즘
      • iOS
        • Swift
      • Database
      • Tips
        • Git & GitHub
        • A to Z
      • 프로젝트
      • 생각정리
  • 태그

    자바
    Spring Security
    성능최적화
    javascript
    생성자
    JPA
    스프링
    최주호
    Database
    sql
    의존성주입
    HTTP
    게시판만들기
    백준
    자바스크립트
    Java
    알고리즘
    프로그래머스
    DB
    변수
    Swift
    html
    다형성
    spring
    객체
    데이터베이스
    jsp
    MVC
    Security
    김영한
  • hELLO· Designed By정상우.v4.10.0
뚜비
[HTTP] URI와 웹 브라우저 요청 흐름
상단으로

티스토리툴바