HTTP 전반에 대한 이해

2020. 10. 23. 16:03웹 프론트엔드 깊게 이해하기/HTTP

www.youtube.com/watch?v=t7ASgtJoVz4&list=PLuHgQVnccGMBd-v_DjNm61EBaDpYZSV1Z

이 글은 위의 영상을 기반으로 작성되었습니다.

HTTP 는 간단히 말해, 웹 브라우저와 웹 서버가 통신할 때 사용하는 규약입니다. 과거에는 html을 전송하기 위한 단순한 규약에 불과했지만, 점점 웹에서 요구되는 것들이 많아지면서 이미지, 비디오 등의 다양한 멀티미디어 파일을 전송하는데 사용되고 있습니다.

 

웹 서버와 웹 클라이언트가 서로 통신하기 위해서는 서로 알고 있는 형식이 똑같은 '메세지'가 필요합니다. 이 HTTP 메세지의 형식을 규정하는 것이 HTTP 입니다.

 

크롬 개발자 도구의 네트워크 탭에서 HTTP 통신을 통해 받아온 파일들을 볼 수 있습니다. 파일이 로드된 순서대로 파일들이 탭에 위에서 아래로 정렬되어 있습니다. 그 파일을 클릭하면 HTTP 메세지를 볼 수 있습니다. 보통 웹페이지라면 html 을 먼저 받아오고, 그 html 을 파싱하면서 그 안의 컨텐츠를 로드합니다.

 

파일을 클릭하면 헤더를 볼 수 있습니다. 헤더 안에 통신에 필요한 주된 내용들이 들어 있습니다. 브라우저와 웹 서버는 이 헤더를 만드는게 주 역할이라고 해도 과언이 아닙니다.

 

헤더 외에도 추가적으로 전송하고 싶은 데이터가 있으면 바디(페이로드라고도 부름)에 집어넣습니다. request 에는 더 상세한 요청에 필요한 데이터가, response 에서는 응답 컨텐츠가 바디에 담깁니다.

 

Request Headers

  • 요청 방식(GET or Post 등) 표시
  • 어떤 파일(데이터)을 요청했는지 표시
  • 어떤 HTTP 버전을 써서 통신하는지 표시
  • 정확히 어느 호스트에 요청을 하는 것인지 표시
  • 지금 요청을 하고 있는 웹 브라우저(User-Agent) 어떤 웹 브라우저인지(웹 서버는 이 정보를 바탕으로 크롤링 봇등의 접근을 차단) 표시
  • 지금 요청을 하고 있는 브라우저가 어떤 압축방식을 지원할 수 있는지(즉, 응답을 할 때 어떤 압축 방식을 택할 수 있는지) 표시
  • 웹 서버에 동일한 정보를 요청해서 중복된 통신이 발생하는 것을 막기 위해 내가 지금 요청하는 정보(파일)이 마지막으로 언제 다운로드 받은 적이 있는지를 표시

 

Response Header

  • request header 를 해석해서 이 response header 를 만들게 됨
  • HTTP 버전 표시
  • 응답 결과 코드(Status Code)와 메시지 표시
  • 응답으로 전송하는 데이터의(파일) 타입을 표시(ex: text/html)
  • 응답하는 컨텐츠의 전체 길이 표시(바이트 단위)
  • 응답하는 컨텐츠가 인코딩(압축)된 방식이 어떤 것인지 표시
  • 응답하는 컨텐츠가 마지막으로 수정된 날짜 표시

'웹 프론트엔드 깊게 이해하기 > HTTP' 카테고리의 다른 글

HTTP 의 Cache 에 대한 이해  (0) 2020.10.23
HTTPS 란?  (0) 2020.10.23