HTTP

juno·2022년 8월 22일
0

통신

목록 보기
3/4

1. HTTP

HTTP는 HyperText Transfer Protocol의 약자입니다. 하나하나 용어에 대한 뜻을 먼저 살펴봅시다.

  • HyperText

    HTTP에서 HyperText는 HTML(HyperText Markup Language)의 HyperText와 그 의미가 동일하다. HTML을 다시 짚고 넘어가보면, 문서와 문서가 링크로 연결되도록 하는 태그로 구성된 언어란 뜻입니다. 다시 말하면, HTML은 웹페이지를 만들기 위해서 웹브라우저 위에서 동작하는 언어를 뜻합니다.

  • Transfer

    사전적 의미로 "전송하다" 라는 의미를 가집니다. 전송에 큰 의미가 있습니다. 전송은 쉬운말로 "물건이나 편지 따위를 보낸다." 라는 의미입니다.

  • Protocol

    프로토콜은 협약, 통신 규약 이라는 의미를 가집니다. 물리적으로 떨어진 컴퓨터 끼리 어떻게 HTML파일(HyperText)을 주고 받을지에 대한 약속입니다.

결론 HTTP란?

컴퓨터들끼리 HTML파일을 주고받을 수 있도록 하는 소통방식 또는 약속입니다.

2. HTTP의 두가지 특징

HTTP는 컴퓨터들끼리의 약속이라고 했습니다. 약속에는 언제나 조항들이 따르기 마련입니다. 그렇다면 HTTP는 어떤 조항으로 이루어져 있는지 함께 살펴보겠습니다.

2-1. Request / Response (요청 / 응답)

📢 소통의 핵심은 요청과 응답

HTTP 통신의 핵심은 요청과 응답입니다.

퓨터 끼리의 소통도 요청과 응답이 있습니다.. 결국 사람이 필요에 의해서 만든 소통 방식이기 때문에 우리의 소통 방식과 큰 차이점이 없습니다.
‘랩탑을 연다. 유튜브에 접속한다. 내가 평소 즐겨보던 유튜브 영상의 링크를 누른다. 그 순간 내 랩탑은 구글의 서버에게 요청을 보낸다. "골든 리트리버 영상 주세요." 구글의 서버는 이 요청을 처리해서 다시 요청을 보낸 나의 랩탑에 응답을 보낸다. "귀여운 골든 리트리버 영상 드립니다." ‘

HTTP를 어렵게 생각할 필요 없습니다. 사실은 우리에게 친숙한 소통방식을 컴퓨터의 소통방식에도 적용한 것입니다.

2-2. Stateless

📢 State(상태) + less(없음)

HTTP에 대한 설명 중 절대 잊어서는 안 될 HTTP의 특징이 바로 Stateless 입니다. 문자 그대로 번역하면 State(상태) + less(없음) 을 의미합니다.

각각의 HTTP 통신(요청/응답)은 독립적 이기 때문에 과거의 통신(요청/응답)에 대한 내용을 전혀 알지 못 합니다. 이전의 상태를 전혀 알지 못 한다는 것은 무엇을 의미할까요?

매 통신마다 필요한 모든 정보를 담아서 요청을 보내야 합니다. 비유를 하자면, 마치 이미 자기소개를 한 사람에게 계속해서 똑같은 내용으로 자기소개를 해야하는 것과 같습니다.

3. Request / Response

가는말이 고와야 오는말이 곱다는 속담이 있습니다. 요청을 잘 해야 응답이 잘 옵니다. 요청을 잘 하고 응답을 잘 받기 위해서는 요청과 응답에 대한 보다 더 깊은 이해가 필요합니다.
실제 프로젝트를 진행할 때, 프론트엔드에서 백앤드에게 데이터를 요청하고 백엔드는 요청을 처리해서 응답을 줍니다. 이 요청과 응답에 대한 구조와 메세지를 잘 파악하면 대부분의 에러를 잡아낼 수 있습니다.

3-1. Request 메세지 구조

📢 요청은 사실 그저 메세지에 불과합니다.

HTTP 요청은 사실 프론트엔드(클라이언트) 에서 백엔드(서버)에 일(데이터 처리)을 시작하게 하기 위해 보내는 메세지 입니다. 이 메세지의 구조는 크게 세 부분으로 구성되어 있습니다.

A. Start Line: 요청의 첫번째 줄에 해당합니다. 이 시작 줄도 세 부분으로 구성되어있습니다.

  • HTTP Method: 해당 요청이 의도한 액션을 정의하는 부분. 주로 GET, POST, DELETE가 많이 쓰임

  • Request target: 해당 request가 전송되는 목표 url

  • HTTP Version: 말 그대로 사용되는 HTTP 버전을 뜻한다. 주로 1.1 버전이 널리 쓰임

B. Headers: 해당 요청에 대한 추가 정보(메타 데이터)를 담고있는 부분입니다.

  • Key: Value 값으로 되어있다 (JavaScript의 객체, Python의 딕셔너리 형태라고 보면 된다)

  • Host: 요청을 보내는 목표(타겟)의 주소. 즉, 요청을 보내는 웹사이트의 기본 주소가 된다. (ex. www.apple.co.kr)

  • User-Agent: 요청을 보내는 클라이언트의 대한 정보 (ex. chrome, firefox, safari, explorer)

  • Content-Type: 해당 요청이 보내는 메세지 body의 타입 (ex. application/json)

  • Content-Length: body 내용의 길이

  • Authorization: 회원의 인증/인가를 처리하기 위해 로그인 토큰을 Authroization 에 담는다

C. Body: 해당 요청의 실제 내용입니다. 주로 Body를 사용하는 메소드는 POST 입니다.

ex) 로그인 시에 서버에 보낼 요청의 내용
Body: {
"user_email":"wecode@gmail.com" "user_password": "wecode"
}

3-2. Response 메시지 구조

💡 응답도 요청과 마찬가지로 메세지 입니다.

HTTP 규약에 따른 응답의 구조도 또한 크게 세 부분으로 구성되어있습니다.

A. Status Line: 응답의 상태 줄입니다.

  • 응답은 요청에 대한 처리상태를 클라이언트에게 알려주면서 내용을 시작합니다. 마치, 편지의 응답에 "응. 잘 지냈어" 라고 안부 인사를 건네는 것과 같습니다. 응답의 Status Line 도 세 부분으로 구성됩니다.

  • HTTP Version: 요청의 HTTP버전과 동일

  • Status Code: 응답 메세지의 상태 코드

  • Status Text: 응답 메세지의 상태를 간략하게 설명해주는 텍스트

B. Headers: 요청의 헤더와 동일합니다. 응답의 추가 정보(메타 데이터)를 담고있는 부분입니다.

  • 다만, 응답에서만 사용되는 헤더의 정보들이 있습니다. (ex. 요청하는 브라우저의 정보가 담긴 User-Agent 대신, Server 헤더가 사용됩니다.)

C. Body: 요청의 Body와 일반적으로 동일합니다.

  • 요청의 메소드에 따라 Body가 항상 존재하지 않듯이 응답도 응답의 형태에 따라 데이터를 전송할 필요가 없는 경우엔 Body가 없을 수도 있습니다.

  • 가장 많이 사용되는 Body 의 데이터 타입은 JSON(JavaScript Object Notation) 입니다.

  • 로그인 요청에 대해 성공했을 때 응답의 내용

Body: {
    "message": "SUCCESS"
    "token": "kldiduajsadm@9df0asmzm" (암호화된 유저의 정보)
}
profile
안녕하세요 인터랙션한 웹 개발을 지향하는 프론트엔드 개발자 입니다. https://kimjunho97.tistory.com => 블로그 이전 중

0개의 댓글