[javascript] Axios를 사용하여 주문 API 호출하기

이번 글에서는 JavaScript의 Axios 라이브러리를 사용하여 주문 API를 호출하는 방법에 대해 알아보겠습니다.

Axios란?

Axios는 브라우저와 Node.js에서 HTTP 요청을 생성하는 기능을 제공하는 JavaScript 라이브러리입니다. 이 라이브러리는 간편하고 직관적인 API를 제공하여 HTTP 요청을 처리하고 응답을 받을 수 있습니다.

주문 API 호출하기

우선, Axios를 프로젝트에 설치해야 합니다. npm을 사용하여 다음 명령을 실행하여 Axios를 설치합니다.

npm install axios

이제 JavaScript 파일에서 Axios를 import하고 주문 API를 호출할 준비가 되었습니다. 아래는 예제 코드입니다.

import axios from 'axios';

const order = {
  orderId: 1234,
  customerName: 'John Doe',
  totalAmount: 50.00,
  items: [
   {
     productId: 1,
     productName: 'iPhone 12',
     quantity: 1,
     price: 1000.00
   },
   {
     productId: 2,
     productName: 'AirPods Pro',
     quantity: 2,
     price: 250.00
   }
  ]
};

axios.post('https://api.example.com/orders', order)
  .then(response => {
    console.log('주문이 성공적으로 완료되었습니다.');
    console.log(response.data);
  })
  .catch(err => {
    console.error('주문 처리 중 오류가 발생했습니다.', err);
  });

위의 코드에서는 order 객체를 생성하고, axios.post 메서드를 사용하여 주문 API에 POST 요청을 보냅니다. API 응답이 성공적으로 돌아오면 then 블록이 실행되고, 실패할 경우 catch 블록이 실행됩니다.

주문 API 호출에 성공하면, 응답 데이터를 출력하고 “주문이 성공적으로 완료되었습니다.”라는 메시지가 표시됩니다. 오류가 발생한 경우, 오류 메시지와 함께 “주문 처리 중 오류가 발생했습니다.”라는 에러 메시지가 표시됩니다.

결론

Axios를 사용하면 JavaScript로 주문 API를 호출하는 일이 간단해집니다. Axios의 간편하고 직관적인 API를 활용하여 HTTP 요청을 보내고 응답을 처리할 수 있습니다.

더 자세한 정보와 기능에 대한 사용법은 Axios 공식 문서를 참조하시기 바랍니다.