HTTP 통신
HTTP란두 컴퓨터간에 텍스트 데이터를 주고 받는 길입니다.
이때 요청(request)와 응답(response) 2가지로 서로 주고 받을 수 있습니다.
HTTP 요청과 응답
HTTP 요청
웹 브라우저에서 홈페이지가 실행중이라면, 작성한 게시물 텍스트 데이터를 HTTP를 통해 Back-end 컴퓨터로 보내고 그 컴퓨터에게 이 데이터를 데이터베이스에 저장해달라고 요청 합니다.
HTTP 응답
요청을 받은 Back-end 컴퓨터가 성공, 실패 등의 처리결과로응답합니다.
이때, 응답 상태코드 라는 것도 함께 보내주는데요,
이 코드는 100~599까지의 숫자로 구성되어 있습니다.
자주 볼 수 있는 응답 상태코드로는 성공(200) Frone-end 에러(400), Back-end 에러(500) 등이 있습니다.
📌 더 많은 상태코드(MDN) : 여기로 접속
API
API란
HTTP 요청을 Back-end 컴퓨터에 보냈을 때 실행되는 Back-end 기능입니다.
Front-end에서 HTTP라는 길을 통해서 게시물 데이터를 Back-end에 보내 저장시켰습니다.
만약, 게시물이 아닌 프로필 데이터를 저장하고 싶으면 어떻게 해야 할까요?
그러기 위해선, 여러개의 HTTP 라는 길이 존재해야 하고, 각각의 요청마다 담당자가 필요합니다.
우리는 이 담당자를 API 라고 부릅니다.
❓API가 기능이라면 함수인가?
맞습니다! API는 백엔드 개발자가 만든함수입니다. 함수는 인자와 return 데이터가 있는데, API에요청할 때 보내는 데이터는API 함수로 들어갈 인자이고,응답으로 받게되는 데이터가API 함수의 return 데이터입니다.
API 종류
API 종류는 크게
rest-api,graphql-API로 2가지가 있습니다.
우선 두개의 차이점을 크게 3가지로 말해볼 수 있는데요,
rest-api와 graphql의 차이점
(1) 함수 이름의 차이
rest-API는 API 이름이 마치 홈페이지 주소처럼 생겼습니다.
graphql-API는 API 이름이 일반적인 함수와 같습니다.
(2) 응답 결과물의 차이
rest-api는 응답 결과로 back-end 개발자가 만든 함수에서 보내주는 모든 데이터를 받아야 합니다.
반면에, graphql-api는 back-end 개발자가 만든 함수에서 필요한 데이터만 골라서 받을 수 있습니다.
이러한 이유로, 각 API에 전송을 요청하는 담당자도 다릅니다.
rest-API 에 요청하는 요청담당자는 fetch 입니다.
graphql-API 에 요청하는 요청담당자는 apollo-client 입니다.
(참고) 요청담당자는 Front-end 에서 설치하는 라이브러리입니다.
graphql은 필요한 데이터만 골라받을 수 있는 장점이 있어서, 효율적인 통신을 할 수 있습니다.
(3) 설치해야 할 프로그램의 차이
rest-API 와 graphql API를 사용하기 위해서는 프로그램을 설치해야 합니다.
rest와 graphql은 각자 설치해야 할 프로그램이 다릅니다.
API 응답 데이터 JSON(Javascript Object Notation)
JSON은 자바스크립트의 객체 표기법입니다.
JSON이란?
백엔드에서 응답을 받을 때, 객체 자체를 주고 받을 수 없습니다.
따라서 객체를 문자열로 묶어서 객체를 담은 문자열을 보내게 되는데, 객체를 담은 문자열을 객체 표기법 이라고 합니다.
즉, 백엔드에서 응답의 결과물로 넘겨주는 것이 JSON이고, JSON은 객체를 담은 문자열 정도로 생각하시면됩니다.
받아온 JSON 데이터는 프론트에서 문자열을 벗겨 객체로 사용하게 됩니다.
JSON의 특징과 응답헤더
응답으로 주고받은 JSON은 응답의 body 부분입니다.
응답에는 header와 body부분으로 나뉘는데 body에는 JSON이 들어간다고 이전에 언급했는데요,
그렇다면 header에는 어떤게 들어갈까요?
header에는 body와 관련된 요약정보가 들어가게 됩니다.
요약정보라 함은 응답을 보내는 사이트가 어디인지, 바디의 형태는 JSON인지 등등을 포함하고 있습니다.
