[GraphQL] GraphQL이 해결한 REST API의 문제점

ds-k.dev·2022년 11월 24일
1

GraphQL

목록 보기
1/2
post-thumbnail

API란?

Application Programming Interface

어플리케이션, 서버, 웹사이트와 유저가 상호작용하기 위해 만든 인터페이스

REST API

URL을 통해 상호작용한다. JSON으로 응답을 받고,받은 데이터를 보여준다.

ex)
1. daeseongkim.com/api/friends -> 김대성의 친구들
2. daeseongkim.com/api/friends/1 -> id가 1인 친구
3. daeseongkim.com/api/friends/search?age=31 나이가 31살인 친구

  • 조직적이고 체계적이라 간단하고, 이해하기 쉽다.
  • 어떤 어플리케이션에서도 쉽게 요청할 수 있다.(그냥 URL이기 때문)
  • Method(동사: GET, POST, DELETE, PUT, PATCH) + 명사: users, friends, movies, lists ...)의 조합으로 직관적으로 해당 URL이 무엇을 의미하는지 알수 있다.

url에 동사를 쓰는 건 좋은 관행이 아니다.
ex) twitter.com/tweet/add (x)
-> add, write, update 등 여러가지 표현이 있을 수가 있어서 예측이 힘듬
GET twitter.com/tweet/:id (o) -> id의 tweet을 가져와라
POST twitter.com/tweet/:id (o) -> id의 tweet을 써라
DELETE twitter.com/tweet/:id (o) -> id의 tweet을 지워라

GraphGL API

GraphQL이 해결한 문제(REST API의 문제)

  1. over-fetching(필요한것 보다 더 받는 문제)

Ask for what you need, get exactly that
-> 원하는 것만 요청하고, 정확히 그것만 받으세요

-> overfetching의 해결
ex) users라는 DB에 김대성의 나이 직업 사돈에 팔촌까지 다 기록되어있을 경우, 나는 김대성의 나이와 이름만이 필요하더라도 ...api/users?name=김대성 하는 순간 사돈에 팔촌까지 다 받아야 한다.

-> graphQL에서는 name, age만 요청하면 된다.

  • request
{
  users {
    name
    age
  }
}
  • response
{
  "users" : {
    "name" : "김대성"
    "age" : 서른마흔다섯
  }
}
  1. under-fetching(필요한것보다 덜 받는 문제)

Get many resources in a single request
-> 하나의 요청에서 많은 리소스를 받으세요

더 받는 것과 덜 받는 것이 동시에 존재하는 문제라는 것이 이해가 안갈수도 있으니 예를 들자면 ...api/user?name=김대성 이라는 URL로 요청을 보냈을때

  • response
result: {
  	name: 김대성,
  	age: 서른마흔다섯,
  	사돈: 누구,  // over-fetching
  	팔촌: 누구,  // over-fetching
 	 friends_id: [
      12,  // under-fetching
      50,  // under-fetching
      123  // under-fetching
	 ],

친구의 아이디가 오면, 친구의 이름을 알기 위해 또 다른 request를 보내야 하는 상황이 생기게 된다. 즉 여러개의 URL이 필요한데, GraphQL은 그렇지 않다는 뜻이다.

  • request
{ // Single request
  users {
    name
    age
    friends {
      name
    }
  }
}
  • response
{ // get many resource!
  "users" : {
    "name" : "김대성"
    "age" : 서른마흔다섯
    "friends" : [
    	{ "name": "박소민" },
  		{ "name": "까까" }
  }
}

0개의 댓글