[WEB] 프론트엔드 기초(1) - HTTP 통신구조에 대한 기본 개념
June 6, 2021
Byeong Chan

웹개발을 1년 넘게 하면서 ajax, fetch API, Axios 라이브러리 등 HTTP 통신을 매번 사용했습니다만, 정작 그 구조에 대해서는 잘 모르고 있었습니다 하하. 면접 때 이런 기초적인 지식이 없어서 탈탈 털린 기억이 있어 한번 정리해보려고 합니다.

HTTP란?

HTTP는 브라우저에서 HTML 문서를 가져올 수 있도록 하는 통신 프로토콜입니다. 웹에서 이루어지는 데이터 교환의 근본이고, 서버-클라이언트간 데이터를 주고 받을 수 있는 프로토콜입니다. HTTP는 HTML 문서 뿐만 아니라, 이미지, 비디오, 텍스트, CSS, Javscript 등 다양한 정보를 가져올 수 있습니다.

보통 클라이언트가 서버의 데이터를 불러올 때 request(요청)한다 하고, 받은 데이터를 response(응답)이라고 합니다.

클라이언트

웹서비스에서 클라이언트(User-Agent)는 보통 웹브라우저를 말합니다. 브라우저는 internet Explore, Chrome, Safari와 같은 브라우저를 말합니다. 브라우저는 단순히 HTML파일과 그 외 페이지에 필요한 리소를 결합하여 렌더링(페이지를 화면에 보여주는 것) 시켜주는 역할을 담당합니다. 그 외 북마크, 다른 URL 이동, 뒤로가기, 앞으로 가기 등이 존재하는거죠. 주 기능은 렌더링입니다.

HTML문서는 HTTP프로토콜을 통해서 받아오게 됩니다. 요청(Request)할 때 헤더와 필요한 정보를 보내어 그에 대한 응답(Response)을 받습니다. 응답에 Status Code가 200(요청 성공 코드)가 나오면 성공적으로 통신이 이루어졌다는 것을 나타내고 HTML 문서와 그외 리소스를 받아와 렌더링하게 됩니다.

WAS(Web Application Server)

클라이언트에서 보내는 요청을 받는 서버가 존재해야 합니다. 서버는 클라이언트에서 요청하는 HTML문서와 관련 리소스를 전달합니다. 그에 따라 클라이언트는 요청에 대한 응답을 받고, 브라우저에 렌더링하게 됩니다.

서버는 단순히 캐시, 세션, Database 등 정보를 얻고 저장합니다. 저장하고 요청의 대한 응답데이터를 만들어줍니다.

HTTP 상태정보

HTTP의 통신과정은 클라이언트 -> 서버 -> 클라이언트 순으로 거치게 됩니다. 이때 서버나 클라이언트는 HTTP의 상태를 저장하지 않습니다. 클라이언트는 통신에 대한 응답만 받을 뿐 연결을 계속해서 유지시킬 순 없습니다.

로그인을 예를 들어 보겠습니다. 클라이언트에서 로그인에 대한 정보를 서버에 요청합니다. 서버는 로그인 정보가 올바르면 성공메세지를, 그게 아니면 실패 메세지를 보내게 됩니다. 클라이언트는 서버로부터 응답을 받고 성공적으로 로그인이 되면 로그인된 화면으로 변경됩니다.

이때 새로고침이나 뒤로가기를 하면 어떻게 될까요? 다른페이지는 로그인된 상태값이 존재하지 않기 때문에 다시 로그인 전 화면으로 변경됩니다. 이러한 현상은 HTTP 통신이 상태값을 저장하지 않기 때문입니다.

상태값을 유지하기 위해 클라이언트는 쿠키, 서버는 세션을 갖습니다. 로그인이 되면 쿠키와 세션에 값이 할당되고 로그인이 유지된다는 상태값을 저장하게 됩니다. 각각 expiration date를 갖고 만료되면 로그아웃 되도록 합니다.

HTTP는 이렇게 상태를 유지하지 않아 세션, 쿠키, 캐시 등 별도의 과정을 거칩니다.

HTTP 연결 과정

연결은 OSI 5계증인 전송계층에서 제어됩니다. HTTP는 응용계층에서 이뤄지기 때문에 전송영역까지 HTTP가 제어하지 못합니다. 그래서 응용단에서는 최대한의 신뢰성있는 연결을 요구해야합니다. 전송계층의 통신 프로토콜 중 대표적인 2가지가 있습니다. UDP, TCP인데, UDP는 날 것 그대로 전송하기 때문에 신뢰성이 떨어지고, TCP는 에러 검증, 오류 제어를 하기 때문에 비교적 신뢰성이 높은 프로토콜입니다. HTTP는 TCP 표준에 의존합니다.

TCP에 의존하는 HTTP/1.0은 연결하기 위해 몇번의 왕복이 필요했었고 여러 리소스를 요청할 때 시간이 그만큼 많이 소요됐습니다. HTTP/1.1은 이러한 문제를 해결하기 위해 파이프라이닝 개념을 도입되었습니다. 파이프라이닝 HTTP Connection 헤더를 사용해 부분적으로 제어가 가능케 되었습니다. 헤더를 도입함으로써 연결을 좀 더 지속적으로 유지하고, 데이터를 주고받을 수 있었습니다.

Comment