Http header, cookie, Frontend와 Backend Request, Response

# Frontend와 Backend에서의 Request와 Response 정리

간단 정리

http header : Client와 Server가 Request, Response 요청에 부가정보를 전송

http cookie : 동일한 서버에 재 요청 시 저장된 데이터를 함께 전송, 동일한 브라우저에서 요청 했는지 판단Frontend와 Backend의 Request&Response : 프론트엔드에서 백엔드로의 요청을 Request라고 하고 백엔드에서 프론트엔드로의 응답을 Response 라고 한다.

 

Frontend는 우리가 생각하는 정적 데이터들의 모음 즉 클라이언트는 index.html을 호출하고 해당 내용을 브라우저에서 확인 가능하다. 그리고 해당 index.html을 호출 하는 과정에서 header나 cookie등에 필요한 값을 담아서 request, response를 할 수 있다.

1. http header 이란?

HTTP 헤더는 클라이언트와 서버가 요청 또는 응답으로 부가적인 정보를 전송할 수 있도록 해줍니다. HTTP 헤더는 대소문자를 구분하지 않는 이름과 콜론 ' : ' 다음에 오는 값(줄 바꿈 없이)으로 이루어져있습니다. 값 앞에 붙은 빈 문자열은 무시됩니다.

2. http cookie 란?

HTTP 쿠키(웹 쿠키, 브라우저 쿠키)는 서버가 사용자의 웹 브라우저에 전송하는 작은 데이터 조각입니다. 브라우저는 그 데이터 조각들을 저장해 놓았다가, 동일한 서버에 재 요청 시 저장된 데이터를 함께 전송합니다. 쿠키는 두 요청이 동일한 브라우저에서 들어왔는지 아닌지를 판단할 때 주로 사용합니다. 이를 이용하면 사용자의 로그인 상태를 유지할 수 있습니다. 상태가 없는(stateless) HTTP 프로토콜에서 상태 정보를 기억시켜주기 때문입니다.

쿠키는 주로 세 가지 목적을 위해 사용됩니다:

1. 세션 관리(Session management) : 서버에 저장해야 할 로그인, 장바구니, 게임 스코어 등의 정보 관리

2. 개인화(Personalization) : 사용자 선호, 테마 등의 세팅

3. 트래킹(Tracking) : 사용자 행동을 기록하고 분석하는 용도

과거엔 클라이언트 측에 정보를 저장할 때 쿠키를 주로 사용하곤 했습니다. 쿠키를 사용하는 게 데이터를 클라이언트 측에 저장할 수 있는 유일한 방법이었을 때는 이 방법이 타당했지만, 지금은modern storage APIs를 사용해 정보를 저장하는 걸 권장합니다. 모든 요청마다 쿠키가 함께 전송되기 때문에, (특히 mobile data connections에서) 성능이 떨어지는 원인이 될 수 있습니다. 정보를 클라이언트 측에 저장하려면 Modern APIs의 종류인 웹 스토리지 API (localStorage와 sessionStorage) 와 IndexedDB 를 사용하면 됩니다.

3. Frontend와 Backend의 Request, Response

프론트 엔드와 백엔드는 상호 관계 라고 보면 된다.

프론트엔드에서 백엔드로의 요청을 Request라고 하고 백엔드에서 프론트엔드로의 응답을 Response 라고 한다.

아래의 이미지를 보면 이해가 쉽다.

 

- 끝 -