HTTP: 두 판 사이의 차이

기술노트
(CS 용어 정리 - HTTP 추가)
 
편집 요약 없음
(같은 사용자의 중간 판 2개는 보이지 않습니다)
1번째 줄: 1번째 줄:
== HTTP란? ==
== 🌐 HTTP란? ==
HTTP는 전송 계층 위에 있는 애플리케이션 계층으로 웹 서비스 통신에 사용된다.


=== HTTP/1.0 ===
'''HTTP(HyperText Transfer Protocol)'''는 
HTTP/1.0은 기본적으로 한 연결당 하나의 요청을 처리하도록 설계되어있다. 이는 서버로부터 파일을 가져올 때마다 TCP의 3-웨이 핸드셰이크를 계속해서 열어야 하기 때문에 '''RTT가 증가'''하는 단점이 있다.
웹에서 HTML 문서나 이미지, 데이터 등을 주고받기 위한 **기본 통신 규약(약속)**입니다.


==== RTT의 증가를 해결하기 위한 방법 ====
* 웹 브라우저(클라이언트)와 웹 서버가 **요청과 응답**을 주고받을 때 사용됩니다.
매번 연결할 때마다 RTT가 증가하니 서버에 부담이 많이 가고 사용자 응답 시간이 길어졌다. 이를 해결하기 위해 이미지 스플리팅, 코드 압축, 이미지 Base64 인코딩을 사용하였다.
* 우리가 주소창에 `https://example.com`을 입력하면, 브라우저는 HTTP를 통해 HTML 문서를 요청하고, 서버는 그에 맞는 응답을 보내줍니다.


* `이미지 스플리팅` : 많은 이미지를 다운로드 받게되면 과부화가 걸리기 때문에 많은 이미지가 합쳐 있는 하나의 이미지를 다운로드 받고, 이를 기반으로 `background-image` 의 `position` 을 이용하여 이미지를 표기하는 방법이다.
----


* `코드 압축` : 코드를 압축해서 개행 문자, 빈칸을 없애서 코드의 크기를 최소화하는 방법이다.
=== 🔧 HTTP의 특징 ===


* `이미지 Base64 인코딩` : 이미지 파일을 64진법으로 이루어진 문자열로 인코딩 하는 방법이다.  
* **텍스트 기반의 프로토콜** 
<br>
: 사람이 읽을 수 있는 구조 (예: GET /index.html)


=== HTTP/1.1 ===
* **요청(Request)과 응답(Response)**으로 구성 
HTTP/1.0에서 발전한 것이 바로 HTTP/1.1이다. 매번 TCP 연결을 하는 것이 아니라 한 번 TCP 초기화를 한 이후에 keep-alive라는 옵션으로 여러 개의 파일을 송수신할 수 있게 바뀌었다. 참고로 HTTP/1.0에서도 keep-alive가 있었지만 표준화가 되어 있지 않았고 HTTP/1.1부터 표준화가 되어 기본 옵션으로 설정되었다.
: 클라이언트가 요청하고, 서버가 응답함


![HTTP/1.1](https://velog.velcdn.com/images/tlsl13/post/f6db7b54-0701-4b65-9616-adf21b32643a/image.png)
* **Stateless (상태를 저장하지 않음)** 
: 요청 간의 연결 정보를 서버가 기억하지 않음


다음 그림처럼 한 번 TCP 3-웨이 핸드셰이크가 발생하면 그다음부터 발생하지 않는 것을 확인할 수 있다. 하지만 문서 안에 포함된 다수의 리소스(이미지, css 파일, script 파일)를 처리하려면 요청할 리소스 개수에 비례해서 대기 시간이 길어지는 단점이 있다.
----


==== HOL Blocking ====
=== 📬 HTTP 요청 메서드 ===
네트워크에서 같은 큐에 있는 패킷이 그 첫 번째 패킷에 의해 지연될 때 발생하는 성능 저하 현상을 말한다.
예를 들어, image.jpg와 style.css, data.xml을 다운로드 받을 때 보통은 순차적으로 잘 받아지지만 image.jpg가 느리게 받아진다면, 그 뒤에 있는 것들이 대기하게 되며 다운로드가 지연되는 상태가 된다.


==== 무거운 헤더 구조 ====
웹에서 요청할 때 사용하는 **기본 명령어**들입니다:
HTTP/1.1의 헤더에는 쿠키 등 많은 메타데이터가 들어 있고, 압축이 되지 않아 무거웠다.
<br>


=== HTTP/2 ===
{| class="wikitable"
HTTP/2는 SPDY 프로토콜에서 파생된 HTTP/1.x보다 지연 시간을 줄이고 응답 시간을 더 빠르게 수 있으며 멀티플렉싱, 헤더 압축, 서버 푸시, 요청의 우선순위 처리를 지원하는 프로토콜이다.
! 메서드 !! 설명 !! 예시
|-
| GET || 서버에서 데이터를 가져올 때 사용 || 페이지 보기
|-
| POST || 서버에 데이터를 보낼 때 사용 || 회원가입, 로그인
|-
| PUT || 서버에 데이터를 '수정'때 사용 || 글 수정
|-
| DELETE || 서버에서 데이터를 삭제할 때 사용 || 글 삭제
|}


==== 멀티플렉싱 ====
----
여러 개의 스트림을 사용하여 송수신한다는 의미로 이를 통해 특정 스트림의 패킷이 손실되었다고 하더라도 해당 스트림에만 영향을 미치고 나머지 스트림은 멀쩡하게 동작할 수 있다.


==== 헤더압축 ====
=== 📥 HTTP 응답 코드 ===
HTTP/1.x에는 크기가 큰 헤더라는 문제가 있었다. 이를 HTTP/2에서는 헤더 압축을 써서 해결하는데, `허프만 코딩 압축 알고리즘` 을 사용하는 HPACK 압축 형식을 가진다.


* `허프만 코딩(huffman coding)` : 문자열을 문자 단위로 쪼개 빈도수를 세어 빈도가 높은 정보는 적은 비트 수를 사용하여 표현하고, 빈도가 낮은 정보는 비트 수를 많이 사용하여 표현해서 전체 데이터의 표현에 필요한 비트양을 줄이는 원리다.
서버는 요청에 대해 **숫자로 된 상태 코드**를 보내줍니다. 
이 코드만 봐도 요청이 성공했는지, 실패했는지 알 수 있어요.


==== 서버 푸시 ====
{| class="wikitable"
HTTP/1.1에서는 클라이언트가 서버에 요청을 해야 파일을 다운로드 받을 수 있었다면, HTTP/2는 클라이언트 요청 없이 서버가 바로 리소스를 푸시할 있다.
! 상태 코드 !! 의미 !! 설명
|-
| 200 OK || 성공 || 요청한 작업이 잘 수행됨
|-
| 301 Moved Permanently || 영구 이동 || 페이지 주소가 바뀜
|-
| 400 Bad Request || 잘못된 요청 || 요청 문법 오류 등
|-
| 401 Unauthorized || 인증 필요 || 로그인 필요
|-
| 403 Forbidden || 접근 금지 || 권한 없음
|-
| 404 Not Found || 찾을 없음 || 존재하지 않는 페이지
|-
| 500 Internal Server Error || 서버 오류 || 서버에 문제가 있음
|}


예를 들어, html에는 css나 js 파일이 포함되기 마련인데 html을 읽으면서 그 안에 들어 있던 css 파일을 서버에서 푸시하여 클라이언트에 먼저 줄 수 있다.
----
<br>


=== HTTPS ===
=== ✉️ 예시 흐름 ===
HTTP/2는 HTTPS 위에서 동작한다. HTTPS는 애플리케이션 계층과 전송 계층 사이에 신뢰 계층인 SSL/TLS 계층을 넣은 신뢰할 수 있는 HTTP 요청을 말한다. 이를 통해 '''통신을 암호화'''한다.


==== SSL/TLS ====
```http
SSL(Secure Socket Layer)은 SSL 1.0부터 시작해서 SSL 2.0, SSL 3.0, TLS(Transport Layer Security Protocol) 1.0 TLS 1.3까지 버전이 올라가며 마지막으로 TLS로 명칭이 변경되었으나, 보통 이를 합쳐 `SSL/TLS` 로 많이 불른다.
GET /index.html HTTP/1.1
Host: example.com


* SSL/TLS은 전송 계층에서 보안을 제공하는 프로토콜이다.
* 클라이언트와 서버가 통신할 때 SSL/TLS를 통해 제 3자가 메시지를 도청하거나 변조하지 못하도록 한다.
* SSL/TLS를 통해 공격자가 서버인 척하며 사용자 정보를 가로채는 네트워크상의 인터셉터를 방지할 수 있다.
* SSL/TLS는 보안 세션을 기반으로 데이터를 암호화하며 보안 세션이 만들어질 때 인증 메커니즘, 키 교환 알고리즘, 해싱 알고리즘이 사용된다.


=== 💡 개발자가 꼭 알아야 할 것 ===


==== SEO에도 도움이 되는 HTTPS ====
HTTP는 브라우저와 서버가 어떻게 대화하는지를 정한 약속
구글(Google)은 SSL 인증서를 강조해왔고 사이트 내 모든 요소가 동일하다면 HTTPS 서비스를 하는 사이트가 그렇지 않은 사이트보다 SEO 순위가 높을 것이라고 공식적으로 밝혔다.


`SEO(Search Engine Optimization)` 는 검색엔진 최적화를 뜻하며 사용자들이 구글, 네이버 같은 검색엔진으로 웹 사이트를 검색했을 때 그 결과를 페이지 상단에 노출시켜 많은 사람이 볼 수 있도록 최적화하는 방법을 의미한다.
GET/POST/PUT/DELETE 같은 메서드로 서버에 요청


서비스를 운영한다면 SEO 관리는 필수이며, 내가 많은 사이트에 사람들이 많은 사람이 유입될 수있도록 캐노니컬 설정, 메타 설정, 페이지 속도 개선, 사이트 관리 등이 있다.
서버는 200, 404, 500 같은 숫자로 결과를 알려줌


==== HTTPS 구축 방법 ====
웹 개발, API 개발 시 반드시 이해해야 하는 기본 지식!
HTTPS 구축 방법은 크게 세 가지로 나눌 수 있는데 직접 CA에서 구매한 인증키를 기반으로 HTTPS 서비스를 구착하거나, 서버 앞단의 HTTPS를 제공하는 로드밸런서를 두거나, 서버 앞단에 HTTPS를 제공하는 CDN을 둬서 구축한다.
<br>


=== HTTP/3 ===
== 📚 참고 자료 ==
HTTP/3은 HTTP/1.1 및 HTTP/2와 함께 `WWW` 에서 정보를 교환하는데 사용되는 HTTP의 세 번째 버전이다. TCP 위에서 돌아가는 HTTP/2와는 달리 HTTP/3은 QUIC라는 계층 위에서 돌아가며, TCP 기반이 아닌 UDP 기반으로 돌아간다.
* [https://kmong.com/self-marketing/539751/LUA54VnQsP 💼 IT 면접용 CS PDF]
 
* [https://inf.run/o1NX 📦 AWS 백엔드 강의]
HTTP/2에서 장점이었던 멀티플렉싱을 가지고 있으며 초기 연결 설정 시 지연 시간 감소라는 장점이 있었다.
* [https://inf.run/rpX4 🤖 ChatGPT 앱 개발 강의]
 
* [https://www.yes24.com/Product/Goods/122536127 📘 백엔드 번역서]
==== 초기 연결 설정 시 지연 시간 감소 ====
* [https://www.youtube.com/c/%EA%B8%B0%EC%88%A0%EB%85%B8%ED%8A%B8with%EC%95%8C%EB%A0%89 🎬 기술노트with알렉 유튜브]
QUIC은 TCP를 사용하지 않기 때문에 통신을 시작할 때 번거로운 3-웨이 핸드셰이크 과정을 거치지 않아도 된다.
 
QUIC은 첫 연결 설정에 1-RTT만 소요된다. 클라이언트가 서버에 어떤 신호를  한 번 주고, 서버도 거기에 응답하기만 하면 바로 본 통신을 시작할 수 있다는 것이다.
 
참고롤 QUIC은 순 방향 오류 수정 메커니즘(FEC)이 적용되었다. 이는 전송한 패킷이 손실되었다면, 수신 측에서 에러를 검출하고 수정하는 방식이며, 열악한 네트워크 환경에서 낮은 패킷 손실률을 자랑한다.

2025년 6월 11일 (수) 12:17 판

🌐 HTTP란?

HTTP(HyperText Transfer Protocol)는 웹에서 HTML 문서나 이미지, 데이터 등을 주고받기 위한 **기본 통신 규약(약속)**입니다.

  • 웹 브라우저(클라이언트)와 웹 서버가 **요청과 응답**을 주고받을 때 사용됩니다.
  • 우리가 주소창에 `https://example.com`을 입력하면, 브라우저는 HTTP를 통해 HTML 문서를 요청하고, 서버는 그에 맞는 응답을 보내줍니다.

🔧 HTTP의 특징

  • **텍스트 기반의 프로토콜**
사람이 읽을 수 있는 구조 (예: GET /index.html)
  • **요청(Request)과 응답(Response)**으로 구성
클라이언트가 요청하고, 서버가 응답함
  • **Stateless (상태를 저장하지 않음)**
요청 간의 연결 정보를 서버가 기억하지 않음

📬 HTTP 요청 메서드

웹에서 요청할 때 사용하는 **기본 명령어**들입니다:

메서드 설명 예시
GET 서버에서 데이터를 가져올 때 사용 페이지 보기
POST 서버에 데이터를 보낼 때 사용 회원가입, 로그인
PUT 서버에 데이터를 '수정'할 때 사용 글 수정
DELETE 서버에서 데이터를 삭제할 때 사용 글 삭제

📥 HTTP 응답 코드

서버는 요청에 대해 **숫자로 된 상태 코드**를 보내줍니다. 이 코드만 봐도 요청이 성공했는지, 실패했는지 알 수 있어요.

상태 코드 의미 설명
200 OK 성공 요청한 작업이 잘 수행됨
301 Moved Permanently 영구 이동 페이지 주소가 바뀜
400 Bad Request 잘못된 요청 요청 문법 오류 등
401 Unauthorized 인증 필요 로그인 필요
403 Forbidden 접근 금지 권한 없음
404 Not Found 찾을 수 없음 존재하지 않는 페이지
500 Internal Server Error 서버 오류 서버에 문제가 있음

✉️ 예시 흐름

```http GET /index.html HTTP/1.1 Host: example.com


💡 개발자가 꼭 알아야 할 것

HTTP는 브라우저와 서버가 어떻게 대화하는지를 정한 약속

GET/POST/PUT/DELETE 같은 메서드로 서버에 요청

서버는 200, 404, 500 같은 숫자로 결과를 알려줌

웹 개발, API 개발 시 반드시 이해해야 하는 기본 지식!

📚 참고 자료