HTTP

HTTP(HyperText Transfer Protocol)은 HTML과 같은 하이퍼미디어 문서를 전송하기 위한 애플리케이션 계층 프로토콜

 

HTTP/1.0

• HTTP/1.0 은 한 연결당 하나의 요청을 처리하도록 설계
• 서버로부터 파일을 가져올 때마다 TCP 3-웨이 핸드셰이크를 계속 영어야 해서 RTT (패킷 왕복 시간) 가 증가하는 단점
• RTT 를 줄이기 위해 이미지 스프라이트, 코드압축, 이미지 Base64 인코딩 방식을 이용

 

이미지 스프라이트

• 여러 개의 이미지를 하나의 이미지 파일로 만들어서 사용하는 기법
• 서버에 이미지 파일을 요청하는 회수가 감소하며 이미지파일 관리에 용이

3개의 이미지를 하나의 파일로 다운로드하며 아래 예시처럼 CSS 의 background-position 속성을 이용해 사용한다

<style>
    .facebook, .google, .linkedin { background: url("icons.png") no-repeat; }
    .facebook { width: 21px; height: 20px; background-position: 0 0; }
    .google { width: 21px; height: 20px; background-position: -21px 0; }
    .linkedin { width: 22px; height: 20px; background-position: -42px 0; }
</style>

HTTP/2.0 를 사용할 때는 오히려 작은 요청을 여러 번 날리는 게 네트워크 사용량에 더 좋을 수도 있다

 

코드압축

• 코드압축은 개행 문자, 빈칸을 없애 코드의 크기를 최소화하는 기법
• 소스코드를 압축하면 용량이 줄어들어 사이트 최적화에 용이

사이트에서 F12 로 개발자 도구를 열고 Source 탭에서 파일을 아무거나 열어보면 이렇게 압축된 코드를 볼 수 있다.

왼쪽 하단에 {} 아이콘을 눌러주면 압축된 코드를 다시 원래 형태로 볼 수 있다

 

이미지 Base64 인코딩

• Base64 는 이진데이터를 텍스트를 변경하는 인코딩 방식
• 64개의 ASCII 코드를 이용해 이미지데이터를 문자열로 64진법의 문자열로 변환

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAArIAAAHcCAYAAAAqb0k3AAAAAXNSR0IArs4c6QAAAJZlWElmTU0AKgAAA.....

이런 이미지를 Base64 인코딩을 해보면 위와 같이 긴 문자열이 생성되며 base64라는 텍스트가 들어가 있다

 

인코딩이란 정보의 형태나 형식을 표준화, 보안, 처리 속도 향상, 저장 공간 절약 등을 위해 다른 형태나 형식으로 변환하는 처리 방식을 말한다.

 

 

HTTP/1.1

HTTP/1.0 처럼 매번 TCP 연결을 하는 것이 아닌 한 번 TCP 초기화를 한 후 keep-alive 옵션으로 여러 개의 파일을 송수신할 수 있게 업그레이드된 버전

왼쪽의 HTTP/1.0은 user가 데이터를 요청할 때마다 TCP 3-웨이 핸드셰이크를 수행해야 하지만 HTTP/1.1 은 연결을 유지한 채 데이터 송수신이 가능한 지속적인 연결을 할 수 있다. 

 

HOL Blocking

HOL Blocking (Head Of Line Blocking) 은 네트워크에서 같은 큐에 있는 패킷이 지연될 때 그 뒤에 있는 패킷들도 지연되는 성능 저하를 말한다.

 

 

HTTP/2

HTTP/2 은 HTTP/1.X 보다 지연 시간을 줄이고 응답 시간을 더 빠르게 할 수 있으며 멀티플렉싱, 헤더 압축, 서버 푸시, 요청의 우선순위 처리를 지원하는 프로토콜

 

멀티플렉싱

하나의 연결 내 여러 개의 request 를 보내느 기술이며 받을 때 순서는 상관하지 않는다. HTTP/1.1 에서는 request 를 순서대로 보내고 하나의 파일을 응답받으면 다음 파일을 요청하는 동기적인 작동방식이서 전체 파일을 받는데 시간이 오래 걸린다.

멀티플렉싱은 하나의 connection 만으로 병렬로 여러 요청을 받을 수 있고 응답을 줄 수 있어 HTTP/1.x 에서 발생하는 HOL Blocking 을 해결할 수 있다. 

 

아래 사이트에서 HTTP 의 버전별 작동방식을 볼 수 있다.

HTTP 1.1 vs HTTP.2 vs HTTP/2 with Push - Manning

 

헤더 압축

HTTP/1.1 의 헤더에는 쿠키 등 많은 메타데이터가 들어 있고 압축이 되지 않아 무거웠지만 HTTP/2 에서는 허프만 코딩 압축 알고리즘을 사용해 헤더 압축을 한 뒤 데이터를 보낸다.

 

서버 푸시

클라이언트의 요청 없이 HTTP/2는 서버가 바로 리소스를 푸시할 수 있다.

그림처럼 클라이언트는 index.html 만을 요청했을 뿐인데 그 외의 css 파일 등 추가적인 리소스를 클라이언트에게 보내준다.

 

 

HTTP/3

HTTP/3 는 QUIC 이라는 계층 위에서 돌아가며 UDP 통신을 사용한다.

QUIC 은 TCP 를 사용하지 않기 때문에 통신을 시작할 때 3-웨이 핸드셰이크 과정을 거치지 않아도 되며 클라이언트가 서버에 어떤 신호를 한 번 주고 서버도 거기에 응답하기만 하면 연결이 되어 통신을 시작할 수 있다.

또한, 순방향 오류 수정 매커니즘이 적용되어 전송한 패킷이 손실된다면 수신 측에서 에러를 검출하고 수정하는 방식이어서 낮은 패킷 손실률를 가지고 있다.

 

 

HTTPS

HTTPS 는 어플리케이션 계층과 전송 계층 사이에 신뢰 계층인 SSL/TLS 계층을 넣어 신뢰할 수 있는 HTTP 요청을 말하며 이를 통해 통신을 암호화한다.

 

SSL/TLS 

SSL/TLS 는 전송 계층에서 보안을 제공하는 프로토콜이며 클라이언트와 서버가 통신할 때 이를 통해 제 3자가 메시지를 도청, 변조하지 못하도록 한다.

SSL/TLS 는 보안 세션을 기반으로 데이터를 암호화하며 보안 세션이 만들어질 때 인증 메커니즘, 키 교환 암호화 알고리즘, 해싱 알고리즘이 사용된다.