✔ HTTP란 무엇인가?
HyperTextTransferProtocol의 약자이고, 하나하나 용어에 대한 뜻을 확인해보자.
1.HyperText : HTTP에서 HyperText는 HTML의 HyperText와 의미가 동일하다. HTML은 문서와 문서가 링크로 연결되도록 하는 태그로 구성하는 언어라는 뜻이며, HTML로 만든 웹페이지를 어떻게 주고 받을 것인가?이다.
2. Transfer : 내가 HTML로 만든 웹사이트(문서, 파일)을 널리 알리고 다른 사람들과 공유하기 위해 다른 컴퓨터에게 전송하는 것을 말한다. 전송은 보내는 주체와 받는 주체가 있다는 것이 큰 특징이다.
3. Protocol : 컴퓨터끼리 어떻게 HTML파일(HyperText)을 주고 받을지에 대한 소통방식 또는 약속이다.(유저가 서버로 보낸 요청에 따라 반응을 보낸다.)
👉 컴퓨터들끼리 HTML파일을 주고받을 수 있도록 하는 소통방식 또는 약속이다.
✔ HTTP의 특징
1. Request & Respond(요청과 응답)
HTTP 통신 소통의 핵심은 요청과 응답이다. 인간의 소통 방식이 컴퓨터끼리의 소통방식에도 적용된 것이다. 말이 아닌 메세지의 형식으로 요청을 하고, 응답한다.
예시) 사용자(request -서버야 나는 OO이야 로그인 시켜줄래?) ↔ 서버(Respond - 로그인에 성공했습니다. 서비스를 시작합니다.)
2. Stateless
HTTP 설명 중 가장 중요한 특징이다. 문자를 그대로 설명하면, State(상태) + less(없음)을 의미한다. HTTP의 개별 통신은 모두 독립적이어서, 과거의 HTTP 통신의 결과(상태)를 보존하지 않는다. 그렇기 때문에 매 통신마다 사전에 필요한 모든 정보를 담아서 요청을 보내야만 한다.
✔ Request & Respond
1. Request 메시지 구조
HTTP요청은 사실 프론트엔드(클라이언트)에서 백엔드(서버)에 일(데이터처리)을 시작하게 하기 위해 보내는 메세지이고 이는 세 부분으로 구성되어있다.(요청은 그저 메세지에 불과하다.)
(1) Start Line : 요청의 첫번째 줄이다.
- HTTP Method : 요청이 의도한 액션을 정의한다. 주로 GET, POST, DELETE가 쓰인다.
- Request target : 요청이 전송되는 목표 url
- HTTP Version : HTTP의 버전
⭐요청의 Start Line 예시⭐
GET /login HTTP/1.1
GET메서드로 / login이라는 요청타겟에 / HTTP 1.1 버전으로 요청을 보내겠다.
(2) Headers : 해당 요청에 대한 추가 정보(메타 데이터)를 담고 있는 부분이다.
- 객체(Key : Value)의 값으로 되어있다.(JavaScript - 객체 / Python - 딕셔너리 형태)
- 자주 사용되는 Headers의 정보
Host : 요청을 보내는 목표(타겟)의 주소. ➡ (예시 www.naver.com)
User-Agent : 요청을 보내는 클라이언트 정보 ➡ (크롬, 파이어폭스, 사파리 등)
Content-Type : 해당 요청이 보내는 메세지 body의 타입 ➡(application / json)
Content-length : body 내용의 길이
Authorization : 회원의 인증/인가를 처리하기 위해 로그인 토큰을 Authroization에 담는다.
(3) Body : 해당 요청의 실제 내용으로 주로 사용하는 메서드는 POST이다.
- 요청의 실제 내용은 객체의 형태이고, 요청 메서드(바디가 있느냐 없느냐)에 따라 존재하지 않을 수 있다.
⭐ 요청 메세지의 실제 예시⭐
2. Response 메세지 구조
HTTP 규약에 따른 응답구조도 크게 세 부분으로 구성되어있다.(요청과 마찬가지로 메세지이다.)
(1) Status Line : 응답은 요청에 대한 처리상태를 클라이언트에게 알려주면서 내용을 시작한다.
- HTTP Version : 요청의 HTTP버전과 동일
- Status Code : 응답 메세지의 상태 코드
- Status Text : 응답 메세지의 상태를 간략하게 설명해주는 텍스트
⭐응답의 Status Line 예시⭐
HTTP/1.1 404 Not Found
HTTP 1.1 버전으로 응답하고 있는데, 프론트엔드에서 보낸 요청(ex. 로그인 시도)에 대해 유저의 정보를 찾을 수 없기 때문에(Not Found) 404 상태 메세지를 보낸다.
(2) Header : 요청의 헤더와 동일하다.(다만, 응답에서 사용되는 헤더의 정보들이 따로 있음)
➡ Request의 User-Agent가 Respondse에서는 Server헤더가 사용된다.
(3) Body : 요청의 Body와 일반적으로 동일하다.(가장 많이 사용되는 Body의 데이터 타입은 JSON(JavaScript Object Notation)이다.
ex) 로그인 요청에 대해 성공했을 때 응답의 내용Body: { "message": "SUCCESS" "token": "kldiduajsadm@9df0asmzm" (암호화된 유저의 정보) }✔ HTTP request methods
- get : 데이터를 받아오기만 할 때(웹페이지에 접속해서 필요한 데이터를 불러올 때)
-post : 데이터를 수정할 때(body에 데이터를 보낼테니 컴퓨터의 데이터베이스에서 수정을 하던 만들던 알아서해라)
-delete : 서버에 저장된 특정 데이터를 삭제할 때 사용한다.
✔ HTTP Status Code
- 잘받았을 때
- 200 : ok
- 201 : created- error
400 : bad request(타겟 리퀘스트가 틀ㄹuTdmf EO)
401 : unauthorized(넷플릭스 미가입자가 가짜로 만들어서 요청하면 나옴)
403 : 넷플 일반 회원인데 프리미엄 보고싶어서 눌렀는데 안됌 (접근금지)
404 : 데이터가 없음- server error
500 : 서버 터졌을 때
✔ 세션 중 나왔던 질문 정리
Q1. 페이지가 변경될 때마다 토큰을 계속 주고 받으면서 유지가 되는건가요?<
👉 A. 토큰을 주고 받으면서 유지가 되고 토큰은 쿠키나 세션으로 저장이 된다. (발급은 백엔드 관리는 프론트엔트)
Q2. 토큰의 유지 기한은 어떻게 되나요?
👉 A. 토큰은 유효기간이 있으며 백엔드에서 설정이 가능하다
Q3. body에 담기는 양식(user, password 같은 키)은 누가 어디서 정해주나요?
👉 A. 키 값은 백엔드에서 정하는 경우가 많으며, 통신을 위한 키 값은 프론트엔드와 백엔드가 상의해서 정해야 한다.(아닐경우 오류 발생)
Q4. 한번 요청을 보낼 때 하나의 메서드 방식만 보낼 수 있나요?
👉 A. 요청 한번에 응답 한번이 세트이기 때문에 get post를 동시에 보낼 수 없다.
Q5. Post메서드로 삭제가 가능한가요?
👉 A. 포스트 메서드로도 가능
간단 회고
HTTP에 대해서는 HTTP라는 단어에 대해서만 들어보았고, 개념에 대해서는 생각해본적이 없었다.
가까운듯 가깝지 않은 내용을 배우면서 처음으로 CS강의가 재밌다는 생각을 했다.
하지만 모두를 알아듣지는 못해 질문을 할 수 없었는데 동기분들이 남겨주신 질문들을 보며 나도 새로운 공부가 되었다.
오늘 배운 내용을 기반삼아서 조금 더 공부를 해볼 수 있도록 해야겠다. 오늘은 여기까지 👋
