MDN의 HTTP 자료 정리 (개요)

아래 사이트에 있는 HTTP에 대한 내용을 정리해 봤습니다.

공부 자료

An overview of HTTP - HTTP | MDN

An overview of HTTP - HTTP | MDN

 

개요

HTTP란?

• HTTP는 리소스(HTML 문서, 이미지, 비디오 등)를 가져오기 위한 약속(프로토콜)입니다.
• 클라이언트-서버 모델로 동작하며, 요청(request)은 클라이언트(웹 브라우저)에서 시작하고, 응답(response)은 서버가 제공합니다.
• 하나의 문서는 텍스트, 이미지, 비디오, CSS, 스크립트 같은 다양한 리소스로 구성됩니다.

HTTP의 동작 방식

1. 통신: 클라이언트와 서버가 메시지를 주고받으며, 클라이언트가 요청을 보내고 서버가 응답합니다.
2. 프로토콜 계층: HTTP는 애플리케이션 계층에 속하며, 데이터를 TCP 또는 암호화된 TLS를 통해 주로 전송합니다.

HTTP의 확장성

• HTML 문서를 가져오는 데만 쓰이지 않고, 이미지·비디오 전송, HTML 양식 처리, 문서 일부 갱신(실시간 업데이트)에도 사용됩니다.

HTTP 기반 시스템의 구성요소

1. 클라이언트(사용자 에이전트)
   • 주로 웹 브라우저를 의미하지만, 검색 엔진 로봇도 포함됩니다.
2. 서버
   • 요청을 처리하고 응답을 제공합니다. 단일 기계처럼 보이지만, 여러 시스템이 협력할 수 있습니다.
3. 프록시
   • 클라이언트와 서버 사이에서 데이터를 중개하며, 캐시나 게이트웨이 역할을 할 수 있습니다.
4. 네트워크 구성 요소
   • 라우터, 모뎀 같은 장치들이 있지만, 이들은 HTTP 동작에는 숨겨져 있습니다.

Client: User-Agent

1. 사용자를 대신해 동작하는 도구입니다. 대부분의 경우, 브라우저가 이 역할을 합니다. 하지만 개발자들이 디버깅에 사용하는 특별한 프로그램도 포함될 수 있습니다.
2. 브라우저의 역할
   • 브라우저는 항상 요청을 보내는 쪽
   • 서버가 되지 않으며, 서버가 먼저 메시지를 보내는 경우를 흉내내기 위한 몇 가지 기술만 추가된 상태
3. 웹 페이지를 표시하는 과정
   • 브라우저는 먼저 HTML 문서를 요청
   • HTML 구문 분석, 실행해야 할 스크립트, 포함된 이미지, 비디오, 디자인을 위한 CSS 같은 리소스를 추가로 요청
   • 리소스를 결합해 사용자에게 완전한 웹 페이지 전달
4. 스크립트와 페이지 갱신
   • 실행된 스크립트는 추가 리소스를 가져와 웹 페이지를 실시간으로 갱신할 수도 있음
5. 하이퍼텍스트와 링크
   • 웹 페이지는 하이퍼텍스트 문서로, 텍스트 일부는 링크로 동작
   • 사용자가 링크를 클릭하면 브라우저가 새로운 요청을 보내고, 응답받은 내용을 해석해 새로운 페이지를 표시

결론적으로, 브라우저는 요청을 보내고 리소스를 모아 웹 페이지를 표시하며, 사용자가 웹을 쉽게 탐색할 수 있도록 돕는 핵심 도구입니다.

Web server

1. 서버의 역할
   • 서버는 클라이언트가 요청한 문서를 제공합니다.
   • 서버는 단일 기계로 보이지만, 실제로는 여러 컴퓨터가 협력하여 작동할 수도 있습니다.
     • 예: 로드 밸런싱(부하 분산), 캐시 서버, 데이터베이스 서버, 전자상거래 서버 등.
2. 서버 구성의 유연성
   • 반드시 하나의 물리적 서버일 필요는 없습니다.
   • 여러 서버가 하나의 기계(물리적 머신)에서 호스팅될 수도 있습니다.
   • HTTP/1.1의 Host 헤더 덕분에 여러 도메인이 같은 IP 주소를 공유할 수 있습니다.

결론적으로, 서버는 단일 시스템처럼 보이지만, 실제로는 여러 시스템이 협력하거나, 여러 서버가 하나의 기계에서 운영될 수 있는 유연한 구조를 가질 수 있습니다.

Proxy

웹 브라우저와 서버 사이의 역할

• 브라우저와 서버 사이에는 많은 컴퓨터와 장치들이 HTTP 메시지를 전달합니다.
• 이들은 **웹 스택의 여러 계층(물리, 네트워크, 전송 계층)**에서 작동하며, 성능에 큰 영향을 줍니다.
• 하지만 HTTP 계층에서는 이들의 작동 방식이 직접 드러나지 않습니다.

프록시(Proxy)란?

• 애플리케이션 계층에서 동작하는 컴퓨터/장치를 프록시라고 합니다.
• 프록시는 요청을 중개하거나 처리하는 역할을 하며, 눈에 보일 수도 있고, 보이지 않을 수도 있습니다.
  • 예: 요청을 수정하거나 그대로 전달하는 경우.

프록시의 주요 기능

1. 캐싱
   • 자주 요청되는 데이터를 임시 저장하여 빠르게 제공.
   • 브라우저 캐시(개인)나 공개 캐시(서버)로 나뉠 수 있음.
2. 필터링
   • 바이러스 검사나 유해 콘텐츠 차단(자녀 보호 기능) 등.
3. 로드 밸런싱
   • 여러 서버가 요청을 분산 처리하여 효율성을 높임.
4. 인증
   • 특정 리소스에 대한 접근 권한을 관리.
5. 로깅
   • 요청/응답 정보를 기록하여 추적 및 분석에 활용.

결론

프록시는 웹에서 요청과 응답을 더 효율적이고 안전하게 처리하기 위해 중요한 역할을 합니다.

데이터 저장(캐싱), 보안(필터링 및 인증), 서버 최적화(로드 밸런싱), 기록 관리(로깅) 등 다양한 작업을 통해 웹의 성능과 사용자 경험을 향상시킵니다.

HTTP의 기초적인 측면

1. HTTP는 간단함

• HTTP는 사람이 읽고 이해하기 쉬운 텍스트 기반 프로토콜입니다.
• HTTP/2는 더 복잡해졌지만 여전히 프레임 단위로 메시지를 캡슐화해 간결함을 유지합니다.
• 테스트하기 쉽고, 초보자에게 진입장벽이 낮습니다.

2. HTTP는 확장 가능함

• HTTP 헤더 덕분에 새로운 기능을 추가하거나 실험하기 쉽습니다.
• 클라이언트와 서버가 새로운 헤더를 이해하기만 하면 기능을 확장할 수 있습니다.

3. HTTP는 상태가 없지만 세션을 지원

• HTTP는 Stateless 프로토콜로, 요청 간에 상태를 저장하지 않습니다.
• 그러나 쿠키를 사용해 세션을 유지할 수 있으며, 이를 통해 일관된 사용자 경험(예: 쇼핑 바구니)을 제공합니다.

4. HTTP와 연결

• HTTP는 연결 자체를 제어하지 않고 전송 계층(TCP/UDP)에 의존합니다.
• TCP는 신뢰성이 높아 HTTP와 주로 사용되며, UDP는 신뢰성이 낮습니다.

5. TCP 연결과 HTTP의 발전

• HTTP/1.0: 요청/응답마다 새 TCP 연결을 열어 비효율적.
• HTTP/1.1:
  • 지속 연결(Persistent Connection) 도입 → 요청/응답이 같은 TCP 연결을 공유.
  • 파이프라이닝(여러 요청을 한 번에 보내기)을 시도했으나 구현이 어려웠음.
• HTTP/2:
  • 단일 연결에서 **다중 전송(Multiplexing)**을 지원해 더 효율적.

6. HTTP를 위한 새로운 전송 프로토콜 실험

• 구글의 QUIC
  • UDP를 기반으로 설계된 새로운 전송 프로토콜.
  • 더 빠르고 신뢰성 있는 전송을 목표로 실험 중.

HTTP로 제어할 수 있는 것

HTTP의 확장성과 기능 제어

HTTP는 시간이 지나며 다양한 웹 기능을 제어하도록 확장되었습니다.

초기에는 캐시와 인증 같은 기본 기능을 제어했으며, 이후 origin 제약사항 완화 같은 고급 기능도 추가되었습니다.

HTTP로 제어 가능한 주요 기능

1. 캐시
   • 서버: 문서를 얼마나 오래, 어떻게 캐시할지를 클라이언트와 프록시에 지시할 수 있습니다.
   • 클라이언트: 캐시된 데이터를 무시하라고 요청할 수 있습니다.
   → 효율적인 데이터 관리를 위한 핵심 기능
2. origin 제약사항 완화
   • 기본 원칙: 브라우저는 보안을 위해 다른 도메인에서 온 데이터 접근을 차단합니다. (동일-origin 정책)
   • 완화 방법: HTTP 헤더를 사용해 특정 조건에서 이 제약을 완화해, 다른 도메인의 데이터를 통합할 수 있습니다.
   → 보안과 편의성을 균형 있게 조정
3. 인증
   • 특정 페이지나 리소스에 접근 권한을 제한
   • 방법:
     • WWW-Authenticate 같은 HTTP 헤더
     • 쿠키를 사용한 세션 설정
   → 사용자 인증과 권한 관리를 가능하게 함.
4. 프록시와 터널링
   • 프록시 역할:
     • 클라이언트와 서버의 실제 주소를 숨김.
     • 네트워크 장벽을 넘어 요청을 전달.
   • 모든 프록시가 HTTP에 국한되지 않으며, SOCKS 또는 FTP 같은 프로토콜도 지원 가능.
   → 네트워크 보안과 접근성 향상.
5. 세션
   • 쿠키를 사용해 요청 간 서버 상태를 연결(상태 없는 HTTP에 상태를 부여).
   • 활용 사례:
     • 쇼핑몰의 장바구니 유지.
     • 사용자 구성(로그인 상태 유지 등).
   → 일관된 사용자 경험 제공.

결론

HTTP는 단순한 리소스 요청/응답 프로토콜에서 확장되어, 캐시 관리, 인증, 네트워크 보안, 세션 유지 등 다양한 기능을 제어할 수 있는 강력한 도구로 발전했습니다. 이를 통해 효율적이고 안전한 웹 경험을 제공합니다.

HTTP 흐름

클라이언트와 서버 간의 통신 과정

1. TCP 연결 열기
   • 역할: 클라이언트는 서버와 데이터를 주고받기 위해 TCP 연결을 만듭니다.
   • 방법:
     • 새 연결을 생성.
     • 기존 연결을 재사용.
     • 서버와 여러 개의 TCP 연결을 동시에 열 수도 있음.
2. HTTP 메시지 전송
   • HTTP 메시지는 클라이언트가 서버에 데이터를 요청하는 형식.
   • HTTP/1.x: 사람이 읽을 수 있는 간단한 텍스트 기반 메시지.
   • HTTP/2: 메시지가 프레임으로 캡슐화되어 사람이 직접 읽을 수 없지만 원칙은 동일.
   예시 요청 (클라이언트 → 서버):

GET / HTTP/1.1 
Host: developer.mozilla.org 
Accept-Language: fr

 

3. 서버 응답 읽기

• 서버는 요청에 대해 응답 메시지를 보냄.
• 응답에는 상태 코드(예: 200 OK), 헤더 정보, 콘텐츠 데이터가 포함.

예시 응답 (서버 → 클라이언트)

HTTP/1.1 200 OK
Date: Sat, 09 Oct 2010 14:28:02 GMT
Server: Apache 
Last-Modified: Tue, 01 Dec 2009 20:18:22 GMT
ETag: "51142bc1-7449-479b075b2891b"
Content-Length: 29769
Content-Type: text/html

<!DOCTYPE html... (여기에는 29,769바이트의 웹 페이지 콘텐츠가 포함됨)

 

4. 연결 닫기 또는 재사용

• 클라이언트는 요청 처리가 끝나면 TCP 연결을 닫거나, 추가 요청을 위해 연결을 재사용합니다.

HTTP 파이프라이닝과 HTTP/2의 발전

• HTTP 파이프라이닝:
  • 여러 요청을 연달아 보내고, 첫 번째 응답을 기다리지 않고 다음 요청을 보낼 수 있음.
  • 하지만 기존 네트워크 환경에서는 구현이 어려운 것으로 판명됨.
• HTTP/2:
  • 프레임 내 다중 요청 처리(Multiplexing) 도입.
  • 요청과 응답을 병렬로 처리해 효율성 향상.

결론

HTTP 통신은 TCP 연결 생성, 메시지 전송, 응답 수신의 단계를 거칩니다. HTTP/1.x의 한계를 극복하기 위해 HTTP/2에서는 다중 요청 처리를 도입해 성능과 효율성을 크게 개선했습니다.

HTTP 메시지

HTTP/1.1과 HTTP/2의 차이점

• HTTP/1.1: 사람이 읽을 수 있는 텍스트 기반 메시지.
• HTTP/2: 메시지가 이진 구조인 프레임 안에 캡슐화되어 효율성이 향상됨.
  • 헤더 압축과 다중화 같은 최적화 가능.
  • 메시지의 의미는 변하지 않아, HTTP/1.1 형식을 이해하는 것이 여전히 유용.

HTTP 메시지의 두 가지 타입

1. 요청(Request)
   • 클라이언트가 서버에 요청하는 메시지.
   • 구성 요소:
     1. HTTP 메서드: 요청의 동작을 정의.
        • 예: GET(데이터 가져오기), POST(데이터 전송), OPTIONS, HEAD.
     2. 리소스 경로: 요청하려는 리소스의 URL 경로.
        • 프로토콜(http://)과 도메인(developer.mozilla.org)을 제외한 부분.
     3. HTTP 버전: 사용 중인 HTTP 프로토콜 버전.
     4. 헤더(Header): 서버에 추가 정보를 전달.
        • 예: 요청의 언어(Accept-Language), 사용자 에이전트 정보 등.
     5. 본문(Body): POST와 같은 메서드에서 데이터를 포함.
        • 예: HTML 폼의 데이터.
   예시 요청:

GET / HTTP/1.1 
Host: developer.mozilla.org
Accept-Language: en

 

2. 응답(Response)

• 서버가 클라이언트에 반환하는 메시지.
• 구성 요소:
  1. HTTP 버전: 응답이 사용한 HTTP 프로토콜 버전.
  2. 상태 코드(Status Code): 요청의 성공 여부를 나타냄.
     • 예: 200 OK(성공), 404 Not Found(리소스 없음), 500 Internal Server Error(서버 오류).
  3. 상태 메시지(Status Message): 상태 코드의 간단한 설명.
     • 예: "OK", "Not Found".
  4. 헤더(Header): 클라이언트에 추가 정보를 제공.
     • 예: 콘텐츠 타입(Content-Type), 데이터 크기(Content-Length) 등.
  5. 본문(Body): 가져온 리소스(예: HTML, 이미지 등)를 포함.
     • 선택 사항.

예시 응답:

HTTP/1.1 200 OK
Date: Sat, 09 Oct 2010 14:28:02 GMT
Server: Apache
Content-Type: text/html
Content-Length: 29769

<!DOCTYPE html> ... (본문 내용)

결론

• HTTP/2는 더 효율적인 구조를 사용하지만, HTTP/1.1 메시지 형식을 이해하는 것이 여전히 중요합니다.
• 요청과 응답은 각기 다른 구성 요소를 가지며, 이를 통해 클라이언트와 서버 간의 통신이 이루어집니다.
  • 요청: 무엇을 해야 하는지 서버에 알림.
  • 응답: 요청의 결과와 리소스를 클라이언트에 전달.

•