[HTTP] Header(헤더)

클라이언트가 서버에 요청을 할 때

서버가 URI와 HTTP Method로 요청을 구분하였다면

 

서버에서는 그 요청의 세부적인 요구사항과

제공사항들을 헤더(Header)의 정보를 가지고 처리하여 응답한다

HTTP 메시지 구조

요청과 응답을 위해 사용되는 헤더는 정말 많은데

그중 꼭 알아야 할 헤더들만 정리해보았다.

 

General Header: (기본 헤더 : 요청 , 응답 둘 다 가능)

1.Date

HTTP메시지를 생성한 일시

 

2.Connection

클라이언트와 서버 간 연결에 대한 옵션

Connection: keep-alive
->현재 TCP Connection을 유지한다는 뜻

Connection: close
->현재의 HTTP 메시지 직후에 TCP 접속을 끊는다는 뜻

3.Cache-Control

HTTP(7) - 쿠키와 세션 그리고 캐시(2)

 

Entity Header: 기본 헤더이면서 Entity Header로 분류되는 헤더

1.Content-Type : 데이터의 형식

Body에 들어가는 데이터가 어떤 타입인지 구분한다.

Content-Type: text/html; charset=utf-8

2.Content-Encoding : 데이터의 압축 방식

데이터를 압축하기 위해서 사용하며, 데이터를 읽는 쪽에서 이 Encoding 정보를 토대로 압축을 해제한다

Content-Encoding: gzip

3.Content-Language : 데이터의 자연언어

자연언어란 말 그대로 한국어 , 영어 같은 언어들을 지칭하며 국제 메시지에서 활용된다

 

4.Content-Length : 데이터의 길이

전달되는 해당 데이터의 바이트 길이 또는 크기를 말한다

(이는 Transfer-Encoding을 사용할 때는 이미 정보가 안에 포함되어 있기 때문에, 별도로 길이를 쓰면 안 된다)

 

5.Content-Location : 데이터의 위치

해당 데이터의 실제 위치를 알려준다

 

Request Header : 요청 헤더

1. Host

요청하는 호스트에 대한 호스트명과 포트번호를 나타낸다 이는 필수 정보인데

하나의 가상 호스트에 여러 어플리에킹션 주소로 등록이 되어 있으면 어떤 어플리에킹션인지 구분이 불가능하기 때문이다

 

2.User-Agent

클라이언트의 애플리케이션 정보 (크롬, 익스플로어 등등)

이를 통해 통계정보나, 에러가 발생하는 브라우저를 파악할 수 있다

user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.107 Safari/537.36

3.From

주로 검색엔진 웹 로봇의 연락처 메일 주소를 나타낸다

 

4.Cookie

HTTP(6) - 쿠키와 세션 그리고 캐시(1)

 

5.Referer

이전 웹 페이지의 주소

referer: https://www.google.com/

6.If-Modified-Since

제공한 일시 이후로만 변경된 리소스를 받을 수 있도록 요청한다

if-modified-since: Sun, 01 Aug 2021 01:59:09 GMT

7.Authorization

인증 토큰을 서버로 보낼 때 사용한다

실 예로 오픈소스 API를 사용할 때 각 오픈소스를 만든 서비스들이 정한 Authorization 규격으로 인증한다

 

8.Origin

서버로 POST 요청을 보낼 때, 이 요청이 어느 주소에서 시작되었는지를 나타낸다

URI를 떠올리면 될 듯한데, 이 주소에는 프로토콜, 호스트, 패스, 포트 등의 정보가 담겨있다

 

9. Accpet

클라이언트가 텍스트 , 이미지 등의 우선하는 미디어 타입을 표현한다

accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9

9.1 Accept-Encoding

클라이언트가 원하는 인코딩 방식을 표현한다

accept-encoding: gzip, deflate, br

9.2 Accept-Language

클라이언트가 원하는 언어를 표현한다

accept-language: en-US,en;q=0.9,ko;q=0.8,ko-KR;q=0.7

 

Response Header : 응답 헤더

1. Server

요청을 처리하는 Origin 서버의 소포트웨어 정보

 

2.Expires

3. Age

4. Etag

HTTP(7) - 쿠키와 세션 그리고 캐시(2)

 

5. Allow

HTTP 메서드를 한정할 수 있다 즉 GET 메서드만 허용하면 GET만 가능한 것

(잘 사용은 안 한다고 한다)

 

6.Last-Modified

리소스를 마지막으로 갱신한 일시

 

7.Location

페이지를 리다이렉션 시킬 수 있는데 HTTP Status code로 조건을 걸어 사용할 수도 있다

예를 들어 300번대나 200번대 응답을 한다면 어느 페이지로 이동할지를 알려주는 것이다

 

8.Content-Disposition

응답 Body를 브라우저가 어떻게 표시해야 할지 표현한다

Content-Disposition: inline
->웹페이지 화면에 표시된다

Content-Disposition:attachment; filename='filename.txt'
->다운로드가 가능하길 원하는 파일을 attachment로 설정하고 파일 이름 또한 설정할 수 있다

9.Content-Security-Policy

다른 외부 파일들을 불러오는 경우, 차단할 소스와 불러올 소스를 명시한다

쉽게 말해 서버가 지정한 소스에서만 파일들을 불러오게끔 허용해주는 것이다

Content-Security-Policy:default-src https:
->https를 통해서만 파일을 가져올 수 있다

Content-Security-Policy:default-src 'self'
->자신의 도메인의 파일들만 가져올 수 있다

Content-Security-Policy:default-src 'none'
->파일을 가져오는 것을 허용하지 않는다

10. Access-Control

요청 헤더 중 Origin 헤더는 이 요청이 어느 주소에서 시작되는지를 알려주는데

이때 요청에서 보내는 프론트주소와 이를 받는 백엔드 주소가 다르면 CORS 에러가 발생한다

에러를 방지하기 위해서는 서버에서 이 헤더에 요청을 시작한 프론트 주소를 적어주어야 한다

Access-Control-Allow-Origin: www.google.com
->프로토콜 , 서브도메인, 도메인, 포트 중 하나만 정보가 달라고 CORS 에러가 발생한다

Access-Control-Allow-Origin: *
-> 이처럼 모든 주소를 허용할 수 있다, 허나 보안에 취약해진다는 단점이 있다

Access-Control-Allow-Methods:
요청 시 사용할 수 있는 메서드를 지정할 수 있다
디폴트값이 GET,POST 이기 때문에 이 헤더가 없다면 디폴트값만 요청 가능하다

Access-Control-Allow-Credentails:
클라이언트 요청이 쿠키를 통해 자격 증명을 해야 하는 경우에 클라이언트는 요청 시
서버에서 정의된 규격의 인증값이 담긴 쿠키를 같이 보내야 한다

 

이 처럼 요청과 응답 사이에는 수많은 정보들을 전달하며

각각의 데이터들과 요청 그리고 응답을 어떠한 식으로 처리할지를 구분한다

 

근데 만약 이러한 요청과 응답을 혼란스럽게 할 수 있다면 어떻게 될까

예를 들어 페이스북에서 구글의 리소스를 요청한다면?

 

CORS(Cross-Origin Resource Sharing)

처음 전송되는 리소스의 도메인과 다른 도메인로부터 리소스가 요청되는 경우를 방지하기 위해서인데

만약 내가 서비스하고 있지 않은 도메인에서 세션을 요청한 후 나의 세션을 획득할 수 있다면

이를 악의적으로 사용할 수 있기 때문에 보안성이 취약해진다

쉽게 비유해보자면 우리나라 원화로 미국에서 현금결제를 하는 것이다

 

서버는 요청 헤더 중 Origin 정보를 받고 이를 토대로 CORS를 처리한다

 

 

SOP(Same-Origin Policy)

CORS과 같이 리소스의 요청을 제한하는 또 다른 정책인데

자바스크립트를 제한한다

 

보통 Ajax를 통해 비동기 통신을 하는데 만약 a.com이라는 사이트에서

b.com에게 요청을 보내면 둘은 같은 출처가 아니기 때문에 SOP에 의해 오류가 발생하는 것이다

 

---

개인 학습을 위해 작성되는 글입니다.

제가 잘못 알고 있는 점에 대한 지적 / 더 나은 방향에 대한 댓글을 환영합니다.

 

참조 링크:

https://www.inflearn.com/course/http-%EC%9B%B9-%EB%84%A4%ED%8A%B8%EC%9B%8C%ED%81%AC/dashboard

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

https://gmlwjd9405.github.io/2019/01/28/http-header-types.html

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

https://brownbears.tistory.com/451