오늘은 http에 대해서 탈탈 털어보겠습니다!🌷

HTTP 프로토콜이란?

HTTP는 Hypertext Transfer Protocol로 웹을 통신할 때 사용하는 프로토콜이다.
웹에서는 브라우저와 서버가 서로 데이터를 전달하기 위해 사용하고 있다.

프로토콜이란?

프로토콜(protocol)은 상호 간에 정의한 규칙을 의미한다. 특정 기기 간에 데이터를 주고받기 위해 정의되었다. 즉, 컴퓨터 내부, 또는 컴퓨터 사이에서 데이터의 교환 방식을 정의하는 규칙체계이다. 기기 간 통신은 교환되는 데이터의 형식에 대한 상호 합의를 요구한다. 이러한 형식을 정의하는 규칙의 집합을 프로토콜이라고 한다.

자주 볼 수 있는 프로토콜에는

• HTTP : Hypertext Transfer Protocol
• HTTPS : Hypertext Transfer Protocol Secure
• POP3 : Post Office Protocol v3
• SSH : Secure Socket Layer
• FTP : File Transfer Protocol

HTTP 프로토콜 특징

1. Connectionless

HTTP는 비연결성의 특징을 가지고 있다. 비연결성은 클라이언트와 서버가 정보를 주고 받으면 바로 연결을 끊어 버리는 것이다. 서버가 클라이언트에게 정보를 주고 나서 연결을 끊어버리면 정보를 주었던 클라이언트가 어떤 것인지 모르게 된다.

1.1 비연결성의 장점

HTTP는 인터넷 상의 불특정 다수에게 연결을 받기로 설계 되어있다. 서버가 클라이언트와 정보를 주고 받고 나서도 연결을 계속하고 있으면 많은 자원이 필요하게 된다...!
따라서 연결을 바로 끊어서 더 많은 연결을 하기 위해 리소스를 줄이는 것이다.

1.2 비연결성의 단점

서버는 클라이언트와 연결을 끊으면 어떤 클라이언트였는지 기억하지 못한다. 따라서 동일한 클라이언트가 계속 요청을 보내도 연결을 시도하고 해제하는 과정이 반복된다. 따라서 연결/해제에 대한 오버헤드가 발생한다.

단점을 해결하기 위해 KeepAlive 속성을 사용할 수 있다. KeepAlive 속성은 지정된 시간동안 서버와 클라이언트 사이에서 패킷 교환이 없을 때, 상대를 확인하기 위해 패킷을 계속 보내는 속성이다. 패킷에 반응이 없다면 그때 연결을 해제한다.
KeepAlive가 완벽한 해결책은 아니다. 서버에 요청이 많은 경우 프로세스 수가 기하급수적으로 증가하기 때문에 메모리를 많이 사용하게 된다.

2. Stateless

HTTP는 상태가 없는 프로토콜이다. 상태가 없다는 것은 데이터를 주고 받기 위해 상태가 각각 독립적으로 관리된다. 즉, 이전에 요청과 다음의 요청은 관련이 없다는 것이다.

2.1 무상태의 장점

서버는 세션과 같이 별도의 추가 정보를 관리하지 않아도 된다. 다수의 요청 처리 및 서버의 부하를 줄일 수 있다. 서버의 성능 상의 이점이 생긴다.

2.2 무상태의 단점

서버는 클라이언트를 식별할 수 없다. 따라서 로그인을 계속 해야 하는 번거로움이 생길 수 있다.

클라이언트는 상태를 기억하기 위해 브라우저의 쿠키에 저장할 수 있다. 서버에 계속 요청을 보내지 않고 쿠키에 저장해서 필요할 때 사용하는 것이다. HTTP의 문제를 해결할 수 있다.

마찬가지로 상태를 저장할 때 서버단에 사용자 정보를 저장할 수 있는 세션도 있다. 브라우저가 아닌 서버에 저장하기 때문에 보안성으로 우수하다고 볼 수 있다. 세션도 완벽한 보안이라고는 할 수 없다. 중간에 정보가 탈취될 수도 있기 때문이다. 서버의 메모리를 차지하고 동시 접속자가 많은 경우 서버 과부하가 걸릴 수 있다.

쿠키와 세션의 보안 문제를 해결하기 위해 토큰을 사용하는 JWT, OAuth 인증 방식이 도입됐다. 보호할 데이터를 토큰으로 암호화해서 원본 데이터 대신 토큰을 사용한다. 토큰을 중간에 탈취하더라도 어떤 내용인지 알 수 없어서 보안성이 높다

HTTP Request & Response

클라이언트는 요청을 보낸다는 의미를 가지고 있고 웹으로 말하면 브라우저이다.
서버는 요청을 받는 쪽이고 데이터를 보내주는 원격지의 컴퓨터이다.

URL

URL은 서버에 자원을 요청하기 위한 주소이다.

https://search.naver.com/search.naver?where=nexearch&sm=top_hty&fbm=1&ie=utf8&query=html
http : protocol
search.naver.com : domain
/search.naver : resource path
?where=nexearch&sm=top_hty&fbm=1&ie=utf8&query=html : query

HTTP 1.1 / 2.0

HTTP/1.1

• 기본적으로 connection 당 하나의 요청을 처리하도록 설계되어 있다.
• 동시 전송이 불가능하여 순차적으로 전송된다.
• 다수의 리소스 (image, css, script)를 처리하려면 리소스의 개수에 비례해서 Latency가 길어진다.

HTTP1.1 문제점

1. HOL(Head Of Line) Blocking
   네트워크에서 같은 queue에 있는 패킷이 첫번째 패킷에 의해 지연되는 경우 발생하는 문제이다. 첫번째 패킷에 의해 다른 패킷까지 지연되는 성능 저하 현상이다.

• HTTP에서의 Head-Of-Line Blocking
  HTTP1.1의 특징인 하나의 connection 당 하나의 요청을 처리하는 것을 해결하는 것은 pipelining이다. 하나의 connection을 통해서 여러개의 파일을 요청할 수 있는 기법이다. 이 기법은 여러개의 사진을 요청받을 때 앞에 있는 리소스로 뒤에 있는 리소스가 대기해야 하는 문제점이 있다. 이 문제점이 HOL blocking이다.

2. RTT(Round Trip Time) 증가
   HTTP1.1의 특징인 하나의 connection 당 하나의 요청을 처리하는 것 때문에 매번 요청마다 connection을 만들어야 한다. TCP 위에서 동작하는 HTTP 특성상 3-way handshacke 가 반복적으로 일어난다. 때문에 불필요한 RTT 증가, 네트워크 지연의 문제점이 발생한다.

3. 헤비한 Header 구조
   헤더에 많은 메타정보가 저장되어 있다. 매 요청마다 중복된 헤더 값을 보내면서 서버 도메인에 관련된 쿠키 정보도 함께 보낸다. 반복적인 헤더 전송 및 쿠키 정보로 인한 헤더 크기 증가의 단점을 가지고 있다.

HTTP1.1 해결 방법

• Image spriting
  이미지 파일 요청 횟수를 줄이기 위해서 하나의 이미지를 보내고 CSS로 해당 이미지 좌표를 지정해서 표시한다.
• Domain Sharing
  여러개의 connection을 생성해서 병렬로 요청을 보낸다. 브라우저에 제한된 connection 개수가 있기 때문에 해결책이 되진 않는다.
• Minified CSS/Javascript
  데이터의 용량을 줄이기 위해 CSS,JS 를 축소해서 적용한다.
• Loader parser
  브라우저가 문서를 얼마나 빨리 로드하는 지에 대한 정보이다.
  - async

  ```
  <script type='text/javascript' src='path/to/s1.js' async></script>
  <script type='text/javascript' src='path/to/s2.js' async></script>
  ```
  스크립트 코드를 비동기적으로 받아온다. 받아오는 동안 파싱을 진행하게 된다.
  - defer
  ```
  <script type='text/javascript' src='path/to/s1.js' defer></script>
  <script type='text/javascript' src='path/to/s2.js' defer></script>
  ```
  순차적으로 진행한다. defer는 대신 브라우저의 파싱을 block하는 속성이 없다. async와 다른 점은 defer는 전체 문서를 불러와서 실행된다.   

• Data URI Schema
  이미지 리소스를 Base64로 인코딩된 이미지 데이터로 직접 기술한 방법이다.
• SPDY
  구글이 개발한 새로운 프로토콜이다. Latency 관점에서 HTTP를 고속화한 프로토콜이다.

HTTP/2

HTTP/1.1의 성능에 초점을 맞춰 수정한 전이다. 성능뿐만 아니라 속도에서도 우월하다.

HTTP/2 특징

1. Multiplexed Streams
   Connection 한개로 동시에 여러개의 메시지를 주고 받을 수 있다. 응답 순서는 상관없다. Stream으로 주고 받게 된다.
2. Stream Prioritization
   리소스 간의 의존관계에 따른 우선 순위를 설정한다. CSS가 이미지보다 늦게오게 되면 브라우저 렌더링 문제가 발생한다. 따라서 리소스 로드 문제를 해결한다.
3. Server Push
   서버는 클라이언트가 요청하지 않아도 리소스를 푸쉬할 수 있다. 클라이언트다 HTML 문서를 요청할 때 해당 문서의 리소스를 사전에 클라이언트에서 다운받을 수 있다. 클라이언트의 요청을 최소화할 수 있다.
4. Header Compression
   클라이언트가 두번 요청을 하게 된다면 중복 Header 를 검충하고 index값만 전송한다. 중복되지 않은 Header 의 정보 값은 Huffman Encoding 기법으로 인코딩하여 전송한다.

상태코드

클라이언트가 서버에 요청을 하면 서버는 응답을 한다. 요청에 대한 처리 상태를 나타낸 것이다.

즉, 서버에서 설정해주는 응답정보이다.

이러한 상태코드로 프론트앤드는 에러를 처리할 수 있다.

2XX - Success

• 200 : GET 에 대한 성공
• 204 : No Content (본문에 내용이 없음)
• 205 : Reset Content (브라우저 새로고침 권고)
• 206 : Partical Content (일부 범위의 데이터 반환)

3XX - Redirection

3XX 상태 코드는 클라이언트가 이전 주소로 데이터를 요청해서 서버에 새 URL로 리다이랙트를 유도하는 경우이다.

• 301 : Moved Permanently (요청한 자원이 새 URL 존재)
• 303 : 요청한 자원이 임시 주소에 존재
• 304 : 클라이언트에서 캐싱된 자원을 사용하도록 권고

4XX - Client error

유효하지 않은 자원을 요청했거나 권한이 잘못된 경우이다. 클라이언트에서 발생하는 에러이다.

• 400 : 잘못된 요청
• 401 : 권한 없이 요청, Authorization 헤더가 잘못된 경우
• 403 : 서버에서 해당 자원에 대해 접근 금지
• 404 : 요청한 자원이 서버에 없음
• 405 : 허용되지 않은 요청 메서드
• 409 : 최신 자원이 아닌데 업데이트 하는 경우

5XX - Server error

서버에서 발생한 오류이다.

• 501 : 요청한 동작에 대해 수행할 수 없음
• 503 : 서버 과부하 및 유지보수로 내려간 경우

HTTP Method

클라이언트가 서버에 어떤 목적을 가지고 요청하는 것인지 알려준다.

• GET : 존재하는 자원을 요청
• POST : 새 자원을 생성
• PUT : 존재한 자원을 변경
• DELETE : 존재하는 자원을 삭제
• HEAD : 서버 헤더 정보 획득
• OPTIONS : 서버 옵션을 확인

HTTP vs HTTPS

HTTP는 서로 다른 시스템들 사이에서 통신을 주고 받게 하는 기초적인 프로토콜이다.
HTTPS(Hypertext Transfer Protocol Secure)의 약자이다.

일반 HTTP 프로토콜은 서버에서 브라우저로 전송되는 데이터가 그대로 온다는 점이 문제이다. 데이터가 쉽게 도난당할 수 있다. HTTPS 프로토콜은 SSL을 사용해서 문제를 해결한다.

SSL

SSL은 보안 소켓 계층으로 웹사이트와 브라우저 사이에 전송된 데이터를 암호화해서 인터넷 연결을 보안유지하는 기술이다. SSL 인증서 서버를 사용자에게 인증하고 서버와 사용자간 전송된 데이터를 암호화 할 수 있게 하는 서버 인증서이다.

SSL을 사용하는 이유는 안전하게 암호화된 연결을 만들어 줄 수 있다. 또한, 서버 브라우저가 정보를 도난당하는 것을 예방한다. 사용자가 사이트에 제공하는 정보를 암호화한다. 중간에서 누군가 정보를 빼돌려도 데이터가 암호화되어 있기 때문에 복호화할 수 없다.

HTTPS 프로토콜이 우수한 것은 보안성 외에도 SEO 품질이 있다. HTTPS로 전환하게 된다면 검색 엔진 최적화에서도 혜택을 볼 수 있다. 또한, 가속화된 모바일 페이지를 만들고 싶을때 HTTPS를 사용해야 한다.

HTTP vs TCP/IP

TCP(Transmission Control Protocol)

발신자에서 수신자로 이동하는 방법을 정의한다. 인터넷 상에서 데이터를 메세지 형태로 보내기 위해 IP와 함께 사용하는 프로토콜이다. 데이터를 작게 나누어서 한쪽에서 다른 쪽으로 옮기고 이를 다시 조립해서 데이터를 만든다. 데이터 단위는 패킷이다. 인터넷에서는 정보를 전달하는 단위를 의미한다. TCP는 패킷을 조립하고 손실된 패킷이 있는지 확인하고 재전송하도록 요청한다.

IP

IP는 인터넷 상의 주소 규칙이다. IP 계층에는 출발 주소, 목적지 주소가 있다. TCP 계층에는 출발 포트와 목적지 포트가 있다. IP가 아파트 주소고 TCP가 동 개념이다.

TCP/IP는 OSI 7계층에서 4계층이다. HTTP는 최상의 계층인 Application 계층에서 동작한다.

즉 HTTP는 TCP/IP 위에서 동작하는 것이다.

데이터 형태는 TCP는 byte Array형태로 정보를 통신한다. HTTP는 String으로 정보를 통신한다.

참조

프런트엔드 개발자가 알아야하는 HTTP 프로토콜
[HTTP] HTTP 특성(비연결성, 무상태)과 구성요소 그리고 Restful API
나만 모르고 있던 - HTTP/2
HTTP1.1 vs HTTP2.0 차이점 간단히 살펴보기
HTTP VS HTTPS 차이, 알면 사이트의 레벨이 보인다.
[TCP/UDP] TCP와 UDP의 특징과 차이