[자바스크립트 딥다이브] 44장 REST API

Bor·2022년 1월 12일
1
post-thumbnail
post-custom-banner

REST API

REST(REpresentational State Transfer)는 HTTP/1.0과 1.1 스펙 작성에 참여했고 아파치 HTTP 서버 프로젝트의 공동 설립자이 로이 필딩의 2000년 논문에서 처음 소개되었다. 발표 당시의 웹이 HTTP를 제대로 사용하지 못하고 있는 상황을 보고 HTTP의 장점을 최대한 활용할 수 있는 아키텍처로 REST를 소개했고 이에 맞게 디자인 하도록 유도하고 있다. ➡️ REST 원칙을 성실히 지키면 "RESTful"이라고 표현한다.

  • REST : HTTP를 기반으로 클라이언트가 서버의 리스소에 접근하는 방식을 규정한 아키텍터
  • REST API : REST를 기반으로 서비스 API를 구현한 것

44.1 REST API의 구성

REST API는 자원, 행위, 표현의 3가지 요소로 구성된다. REST는 자체 표현 구조로 구성되어 REST API만으로 HTTP 요청의 내용을 이해할 수 있다.

구성 요소내용표현 방법
자원(RESOURCE)자원URI(엔드 포인트)
행위(VERB)자원에 대한 행위HTTP 요청 메서드
표현(representations)자원에 대한 행위의 구체적 내용페이로드

44.2 REST API 설계 원칙

REST에서 가장 중요한 기본적 원칙은 두 가지. ⭐ URI는 리스소를 표현하는데 집중, 메서드는 HTTP 요청 메서드를 통해⭐ 하는 것이 RESTful API를 설계하는 중심 규칙이다.

1. URI는 리소스를 표현해야 한다.

URI는 리소스를 표현하는데 중점을 둬야. 리소스를 식별할 수 있는 이름은 동사보다 명사를 사용한다. 따라서 이름에 get 같은 행위에 대한 표현이 들어가서는 안 된다.

# bad
GET / getTodos / 1 ----(get ❌)
GET / todos / show / 1 ----(show ❌)

# good
GET / todos /1 

2. 리소스에 대한 행위는 HTTP 요청 메서드로 표현한다

HTTP 요청 메서드는 클라이언트가 서버에게 요청의 종류와 목적(리소스에 대한 행위)을 알리는 방법이다. 주로 5가지 요청 메서드(GET, POST, PUT, PATCH, DELETE 등)를 사용해 CRUD를 구현한다

HTTP 요청 메서드종류목적페이로드
GETindex/retrieve모든/ 특정 리스소 취득
POSTcreate리소스 생성
PUTreplace리소스의 전체 교체
PATCHmodify리소스의 일부 수정
DELETEdelete모든/특정 리소스 삭제

🙋 그래서 우리가 흔히 글을 포스팅한다고 하고 게임 등을 패치 한다고 표현하는건가?

리소스에 대한 행위는 HTTP 요청 메서드를 통해 표현하며 URI에 표현하지 않는다. 예를 들어, 리소스를 취득하는 경우에는 GET, 리소스를 삭제하는 경우에는 DELETE를 사용하여 리소스에 대한 행위를 명확히 표현한다.

# BAD 
GET / todos / delete / 1

# GOOD
DELETE / todos / 1

44.3 JSON Sever를 이용한 REST API 실습

HTTP 요청을 전송하고 응답을 받으려면 서버가 필요. JSON Sever을 사용해서 가상 REST API 서버를 구축해 HTTP 요청을 전송하고 응답을 받는 실습을 진행해보자.


44.3.4 GET 요청

todos 리소스에서 모든 todo를 취득(index)한다.



todo 리소스에서 id를 사용해 특정 todo를 취득한다. public 폴더에 다음 get_retrieve.html을 추가하고 브라우저에서 http://localhost:3000/get_retrieve.html로 접속한다

44.3.5 POST 요청

todos 리소스에 새로운 todo를 생성한다. POST 요청 시에는 setRequestHeader 메서드를 사용해 요청 몸체에 담아 서버로 전송할 페이로드의 MIME 타입을 지정해야 한다.


44.3.6 PUT 요청

PUT은 특정 리소스 전체를 교체할 때 사용한다. 다음 예제에서는 todos리소스에서 id로 todo를 특정하여 id를 제외한 리소스 전체를 교체. PUT 요청 시에는 setRequestHeader 메서드를 사용해 요청 몸체에 담아 서버로 전송할 페이로드이 MIME 타입을 지정해야.

💫에러났었음!💫

우선 id:4 짜리가 없기도 했구요. 교재를 그대로 타이핑한 것은 아니었고. 그리고 send에서 id:1만 바꾸면 되는게 아니라 open에서 /1로도 바꿔야 에러가 나지 않는다


44.3.7 PATCH 요청

PATCH는 특정 리소스의 일부를 수정할 때 사용. PATCH 요청 시에는 setRequestHeader 메서드를 사용해 요청 몸체에 담아 서버로 전송할 페이로드의 MIME 타입을 지정해야 한다.

44.3.8 DELETE 요청

todos 리소스에서 id를 사용해 todo를 삭제한다.


TIL

  • GET, POST, PUT, PATCH, DELETE 를 '한 번 해봤다' 정도!
  • REST API 관련한 요구가 자격요건 혹은 우대사항에서 많이 보이는데 개념을 잡을 수 있었고 이후에 노드 스터디에서 자세한 것은 직접 짜봐야겠다.
  • 중간중간 코드가 되게 어렵게도? 낯설기도? 한데 복습하면서 보면 그렇게 어렵지 않다.
  • 결국
    [만들기]
    • new 로 XMLHttpRequest를 생성해주고 (나 이제부터 시작할거야~ 선언)
      [초기화]
    • open 으로 열고 ( ) 안에 어떤 작업을 수행할지 적어주고
    • send 로 요청을 전송하고(단순 get이 아니고 내가 보내는 거면 JSON.stringfy로 페이로드 해주고)
    • onload 로 성공한 경우 발생할 것 else로 실패시 발생할 것을 지정해주는 것!
  • 패턴화를 하면 순서도 일관적으로 짤 수 있고 최소한 헤메지 않고 만들 수 있더라!
post-custom-banner

0개의 댓글