Axios

의미

💡 Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리
💡 설치가 별도 필요
💡 자동으로 JSON데이터로 변환됨

설치

npm install axios

GET

📗 fetch

//Promise
fetch(URL, {method : 'GET'})
  .then((response) => response.json())
  .then((json) => return json)
  .catch((error) => console.log(error));

//Async & await
async function x() {
  const response = await fetch(URL, {method : 'GET'});
  const data = await response.json();
  return data;
}

x();

📗 axios

//Promise
import axios from 'axios';

axios
  .get(URL)
  .then((response) => {
    const { data } = response;
    return data;
  })
  .catch((error) => console.log(error));

//Async & await
async function x(){
  const response = await axios.get(URL);
  const { data } = response;
  return data;
}

x();

POST

📗 fetch

//Promise
fetch(URL, {
  method : 'POST',
  headers : {
    'Content-Type' : 'application/json',
  },
  body : JSON.stringify({ name : 'a', number : 1 }),
})
  .then((response) => response.json())
  .then((json) => return json)
  .catch((error) => console.log(error));

//Async & await
async function x() {
  const response = await fetch(URL, {
    method : 'POST',
    headers : {
      'Content-Type' : 'application/json',
    },
    body : JSON.stringify({ name : 'a', number : 1 }),
  });
  const data = await response.json();
  return data;
}

x();

📗 axios

//Promise
import axios from 'axios';

axios
  .post(URL, {
    name : 'a', number : 1
  })
  .then((response) => {
    const { data } = response;
    return data;
  })
  .catch((error) => console.log(error));

//Async & await
async function x() {
  const response = await axios.post(URL, {
      name : 'a', number : 1
  });
  const data = await response.json();
  return data;
}

x();