axios

1. 개요2. 예시 코드3. 장점4. 단점

1. 개요

JavaScript의 웹 요청 라이브러리.

React(라이브러리)와 Vue.js에서 데이터를 fetch하는 기본 라이브러리이며 현대 웹 환경에서 서버에서 데이터를 받아오는 일은 이 라이브러리를 기반으로 이루어지고 있다.

2. 예시 코드

#!syntax javascript
const axios = require('axios');

// Make a request for a user with a given ID
axios.get('/user?ID=12345')
  .then(function (response) {
    // handle success
    console.log(response);
  })
  .catch(function (error) {
    // handle error
    console.log(error);
  })
  .then(function () {
    // always executed
  });

// Optionally the request above could also be done as
axios.get('/user', {
    params: {
      ID: 12345
    }
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  })
  .then(function () {
    // always executed
  });  

// Want to use async/await? Add the `async` keyword to your outer function/method.
async function getUser() {
  try {
    const response = await axios.get('/user?ID=12345');
    console.log(response);
  } catch (error) {
    console.error(error);
  }
}

3. 장점

서버, 클라이언트 모두에서 쓸 수 있다.
기피되고 있는 jQuery, deprecated된 request, 웹 표준이지만 최근까지 Node.js 지원이 안 되었던 fetch API 등 경쟁 라이브러리에 비해 양 플랫폼 모두에서 쉽고 무난하게 사용할 수 있다.

4. 단점

기본적인 기능에 지나치게 충실해 풀링 기능 지원이나 중복 요청 제거 등 부가 기능이 부실하다. 이러한 점 때문에 최근에는 react-query나 swr등의 라이브러리 등이 나와있으나 아직까지 메이저한 라이브러리는 아니다. 다만 이는 axios는 상태 관리와 무관한 순수 웹 요청 라이브러리이기 때문에 axios 자체의 문제점이라고는 할 수 없다.

axios

1. 개요

2. 예시 코드

3. 장점

4. 단점

분류