axios

김영진·2022년 8월 14일
0

TIL

목록 보기
29/29
post-thumbnail
post-custom-banner

Axios란?

axios는 node.js와 브라우저를 위한 프로미스 기반 http 클라이언트이다. 동일한 코드베이스로 브라우저와 node.js에서 실행할 수 있다.
브라우저에서는 XMLHttpRequest를 사용한다.

XMLHttpRequest(XHR)란?
XHR 객체는 서버와 상호작용할 때 사용한다. XHR을 사용하면 페이지의 새로고침 없이도 URL에서 데이터를 가져올 수 있다.

Axios 단축 메서드

axios를 편리하게 사용하기 위해 모든 요청 메서드는 단축 메서드가 제공된다. 객체 옵션을 이것저것 주면 가독성이 떨어지니, 함수형으로 재구성하여 나눠놓은 것이다.
대표적으론 아래 4가지가 있다

  • GET: axios.get(url[, config])
  • POST: axios.post(url, data[, config])
  • PUT: axios.put(url, data[, config])
  • DELETE: axios.delete(url[, config])

Axios GET

get 메서드는 크게 2가지 상황에서 사용한다.

  1. 단순 데이터 요청을 수행할 때
  2. 파라미터 데이터를 포함시킬 때(유저나 상품의 id값으로 조회)
axios.post(`url/${parameter}`);

Axios POST

post 메서드는 일반적으로 데이터를 message body에 포함시켜 보낸다.

axios.post("url", {key: value});

Axios PUT

put메서드는 저장되어 있는 내용을 수정하는 목적으로 사용된다. put메서드는 서버 내부적으로 get -> post 과정을 거치기 때문에 post메서드와 형태가 비슷하다.

axios.put("url", {key: newValue});

Axios DELETE

delete 메서드는 일반적으로 body가 비어있다. REST 기반 API 프로그램에서 데이터베이스에 저장되어 있는 내용을 삭제하는 목적으로 사용한다.

axios.delete(`url/${parameter}`);
profile
노션 및 티스토리로 이동 예정입니다.
post-custom-banner

0개의 댓글