1. 통신과 HTTP

▪ HTTP의 특징인 stateless를 설명할 수 있다.
▪ HTTP의 Request와 Response의 구조를 알 수 있다.

HTTP란?

Hyper Text

HTML(Hyper Text Markup Language)
Hyper Text = 문서와 문서가 링크로 연결

Transfer

HTML로 만든 웹페이지 문서를 보낸다.

Protocol

HTML을 어떻게 주고 받을지에 대한 통신 규약/약속

HTTP는 어떻게 통신하나?

📌Request 와 Response 관계로 주고 받는다.

📌Statless
HTTP 개별 통신은 모두 '독립적', 과거의 HTTP 통신의 결과(상태)를 보존하지 않는다.
State(상태) + less(없음)
→ 매 통신마다 요청에 대한 필요한 정보들을 전부 담아줘야 한다.

이렇게 했을 때의 장점 : 트래픽이 증가할 때, 이에 대응하는 서버 컴퓨터의 용량만 늘리면 요청에 따라 바로 일처리가 가능하다. 또한 상태라는 또 다른 데이터를 서버컴퓨터에 저장하지 않아도 되기 때문에 가볍다.(저용량) 한 번의 응답으로 확실한 의사소통이 가능하다는 장점도 있다.

어떤 구조로 통신하나?

👉컴퓨터는 오로지 Text형식(코드)으로 소통한다.(요청과 응답)

✔ Start Line

• 요청의 첫번째 줄
• HTTP method : 요청이 의도한 액션 정의
• Request target : 요청이 전송되는 목표 url
• HTTP version : HTTP 버전

✔ Headers

• 요청의 메타데이터를 담고 있는 부분 | 응답의 메타데이터를 담고 있는 부분
• { key : value }의 형태
• Headers {
  Host : www.naver.com
  User-Agent : chrome
  Content-Type : application/json
  Content-Length : 50
  }

✔ Body

• 요청의 실제 내용 | 응답 해줄 데이터
• Body : {
  "username" : "naver"
  "password" : "naver12345"
  }
  👉 요청 메서드에 따라 존재하지 않을 수도 있다!

✔ Status Line

• 응답의 시작
• 요청에 대한 답장이다.
• HTTP version: HTTP 버전
• Status Code : 응답 상태 코드
• Status Text : 응답의 상태를 간략히 설명하는 텍스트

2. HTTP Request Methods

📌GET

데이터를 받아오기만 할 때 사용
웹페이지에 접속해서 필요한 데이터를 불러올 때 사용
ex. 홈페이지 접속 시 / 블로그

📌POST

데이터를 생성 / 수정할 때 사용
Body에 담는 내용이 핵심!
무언가 새로운 등록이 일어나거나 update가 될 때? 사용
ex. 회원가입 / 장바구니 ..

📌DELETE

서버에 지정된 특정 데이터를 삭제할 때 사용

이 외에 put, patch도 있는데 잘 안사용하는 추세..

Status Code

400~ Error : 프론트 단에서 요청을 잘못한 경우

• 400 : 요청에 대한 parameter가 맞지 않다, 요청에 대한 body가 맞지 않다. 등
• 401 : 토큰 누락
• 403 : 토근은 승인이 됐는데, 인증이 안될 경우 접근 차단
• 404 : 리소스가 없을 때

1. GET

이름 그대로 어떤 데이터를 서버로 부터 받아 올 때 사용한다.
웹페이지에 처음 접속하면 필요한 정보들을 모두 GET 메서드로 요청 보내 응답한 화면이 우리에게 보여지는 것이다.

class101.net 페이지 첫 로딩화면시 network 패널

2. POST

데이터를 생성하거나 수정할 때 많이 사용되기 때문에 대부분의 경우 요청에 body가 포함되서 보내진다.
요즘은 삭제, 덮어씌우기 모두 post 방식으로 하는 추세이니 참고하자

클래스 중 한 강좌를 클릭했을 때 Network 패널의 모습