Axios는 JavaScript에서 HTTP 요청을 처리하는 데 매우 편리한 라이브러리입니다. 이번 글에서는 Axios를 사용하여 사운드 API를 호출하는 방법을 알아보겠습니다.

Axios 설치하기

npm을 사용하여 Axios를 설치할 수 있습니다. 다음 명령어를 사용하여 Axios를 프로젝트에 설치합니다.

npm install axios

Axios를 사용하여 사운드 API 호출하기

Axios를 import 한 후, axios.get 메서드를 사용하여 사운드 API를 호출할 수 있습니다. 다음은 예시 코드입니다.

import axios from 'axios';

// API 엔드포인트 URL
const url = 'https://api.soundapi.com/sounds';

// GET 요청 보내기
axios.get(url)
  .then(response => {
    // API 응답 처리
    console.log(response.data);
  })
  .catch(error => {
    // 에러 처리
    console.error(error);
  });

위 코드에서는 axios.get 메서드를 사용하여 GET 요청을 보낸 후, 응답을 처리합니다. 응답 데이터는 response.data에 포함되어 있습니다. 또한 에러가 발생한 경우 catch 블록에서 에러를 처리합니다.

요청 매개변수 추가하기

사운드 API 호출 시에는 종종 요청 매개변수를 추가해야 할 수도 있습니다. axios.get 메서드의 두 번째 매개변수로 요청 매개변수를 전달할 수 있습니다.

axios.get(url, {
  params: {
    limit: 10,
    category: 'music'
  }
})

위 예시에서는 limit과 category라는 두 개의 요청 매개변수를 설정하고 있습니다. 이러한 매개변수는 API의 공식 문서를 확인하여 필요한 값을 찾을 수 있습니다.

요청 헤더 설정하기

API 호출 시에는 때로는 요청 헤더도 설정해야 할 수 있습니다. axios.get 메서드의 세 번째 매개변수로 요청 헤더를 전달할 수 있습니다.

axios.get(url, {
  headers: {
    'Authorization': 'Bearer {token}'
  }
})

위 예시에서는 Authorization 헤더에 토큰을 포함시키고 있습니다.

결론

Axios를 사용하여 사운드 API를 호출하는 방법에 대해 알아보았습니다. Axios는 간단하고 유연한 인터페이스를 제공하여 HTTP 요청을 쉽게 처리할 수 있게 해줍니다. Axios의 자세한 사용법은 Axios 공식 문서를 참조하시기 바랍니다.