HTTP 헤더 간단 정리

오늘의 주제는 바로 바로 HTTP 헤더입니다!!

먼저 그 전에 HTTP에 대해서 간단히 짚고 넘어가겠습니다. HTTP는 Hyper Text Transfer Protocol의 약자죠.프로토콜!! 규약입니다. 무슨 규약이냐면~~ 인터넷에서 데이터를 주고 받을 때의 통신 규약(즉 프로토콜)입니다.

이 규약에 맞게 클라이언트는 서버에 요청을 보내고, 서버는 클라이언트에게 응답을 줍니다.

http 요청 프로토콜과 응답 프로토콜을 잠시 보겠습니다.

출처:http://www.ktword.co.kr/test/view/view.php?m_temp1=648

http 요청 프로토콜은 요청하는 방식을 정의하고, 클라이언트의 정보를 담고 있습니다. 첫번째 줄은 request line으로 무슨 메서드인지(get, post등), url이 어딘지, 프로토콜 버전은 몇인지가 들어갑니다. 그 다음은 헤더인데, 이게 오늘 다룰 것이죠. 그 후에 공백 한 줄 들어가고, 바디에는 어떤 데이터를 요청할 때 추가적으로 필요한 데이터가 들어갑니다. 예를 들어서 로그인 요청 보낼 때 아이디, 비밀번호 같은 것이요.

응답 프로토콜은 유저가 보게 되는 웹 페이지 정보를 담고 있어요. request line 대신 status line이 있는 것 빼고는 비슷하죠. status line에는 프로토콜 버전, 상태 코드(200, 404 등), 상태 메시지(ok 등)이 옵니다. 이제 곧 다룰 헤더가 있고요. 공백 한 줄 들어가고, 바디 부분에는 사용자가 요청한 데이터 즉 html, css, js, 그림 파일 등이 옵니다.

이제부터 http 헤더를 볼 건데요. http 헤더는 클라이언트가 요청 보낼 때, 서버가 응답 줄 때 부가적인 정보를 담고 있습니다. 크게 네 종류로 나누는데요. 하나 하나 볼게요.

일반 헤더(General Header)

일반 헤더는 일반적인 정보를 담았고, 요청 프로토콜과 응답 프로토콜 둘 다에서 사용 가능합니다.

대표적으로는 메시지가 만들어진 날짜와 시각을 표현하는 Date, 캐시 관련된 설정(브라우저가 캐시를 저장할지 말지, 캐시의 유효시간은 어떤지 등)을 담은 Cache-Control이 있습니다. 

(더 많은 헤더들이 존재하는데, 저는 다른 블로그/ MDN에서 대표적인 예시라고 말씀해주신 것들만 몇 개 봤습니다.)

예)

엔티티 헤더(Entity Header)

엔티티 헤더는 바디에 대한 정보를 담고 있습니다!
대표적으로 메시지 바디 길이를 바이트 단위로 표현한 Content-Length, 메시지 바디의 컨텐츠 종류와 인코딩 타입을 알려주는 Content-Type이 있습니다.

예)

요청 헤더(Request Header)

request 헤더는 클라이언트 정보를 담았고 요청 프로토콜에서 씁니다.
대표적으로는 서버에 쿠키를 보내주는(전에 받았던 쿠키겠죠?) Cookie, 요청된 URL의 호스트명인 Host, 클라이언트 프로그램에 관한 정보(운영체제, 브라우저 등)를 담은 User-Agent, 인증 토큰을 담은 Authorization이 있습니다. 프론트엔드 개발할 때, api에 jwt 토큰을 담아서 보낼 때! Authorization 썼던 게 생각나네요~

예)

응답 헤더(Response Header)

응답 헤더는 응답 프로토콜에서 쓰고, 서버의 정보를 가지고 있어요.
대표적으로 웹 서버 정보를 담은 Server, 쿠키를 브라우저로 보낼 때 쓰는 Set-Cookie 등이 있습니다.

예)

이걸 직접 확인해보고 싶으면, 크롬 브라우저에서 F12 혹은 검사를 누르고, 네트워크 창을 보면 됩니다.

이런 상태일텐데 Ctrl+R을 누르면 여러 가지가 뜹니다.

참고 자료

https://developer.mozilla.org/ko/docs/Web/HTTP/Headers

HTTP 헤더 - HTTP | MDN

https://www.youtube.com/watch?v=mQTGmxendk8

https://velog.io/@pixelstudio/크롬-개발자-도구로-보는-HTTP-헤더-알아보기

크롬 개발자 도구로 보는 HTTP 헤더 알아보기