Axios란? 설치하기, 사용법, fetch와 차이점

Axios란?

Axios는 자바스크립트에서 HTTP 통신을 쉽게 처리할 수 있도록 만든 라이브러리입니다.

Node.js 와 브라우저에서도 사용할 수 있습니다.

Axios에는 많은 기능들이 있어서, 쉽고 편리하게 데이터를 가져올 수 있어서 개발자들이 많아 사용하는 방법입니다.

 

Axios 설치하기

npm install axios

npm을 이용해서 설치 후 사용 가능합니다.

Axios 사용법

node.js 환경에서는 선언해야 합니다.

const axios = require('axios');

get 호출

axios.get('https://jsonplaceholder.typicode.com/todos/1')
  .then((response) => {
    // 요청 성공 시 처리
    console.log(response.data);
  })
  .catch((error) => {
    // 요청 실패 시 처리
    console.error(error);
});

post 호출

const data = {
    title: 'foo',
    body: 'bar',
    userId: 1,
  };
  
axios.post('https://jsonplaceholder.typicode.com/posts', data)
  .then((response) => {
    // 요청 성공 시 처리
    console.log(response.data);
  })
  .catch((error) => {
    // 요청 실패 시 처리
    console.error(error);
  });

 

fetch와의 차이점

자바스크립트에서는 HTTP 통신을 할 수 있는 fetch API가 있습니다.

fetch API는 물론 강력하고 좋지만,

axios를 사용하면 더 좋은 점이 몇 가지 있습니다.

• 인터셉트 기능
• 에러 처리
• 취소 중단 기능
• 자동 Json 파싱

위 기능들을 axios를 사용하면 이용할 수 있습니다.

 

그래서 많은 개발자들이 선호하며, 많이 사용하고 있습니다.