Axios는 많은 개발자들에게 널리 사용되는 JavaScript HTTP 클라이언트입니다. 이 블로그 포스트에서는 Axios를 사용하여 동적으로 API URL을 변경하는 방법을 알아보겠습니다.

API URL 동적으로 변경하기

Axios를 사용하여 API 요청을 보낼 때, 일반적으로 하드코딩된 URL을 사용합니다. 그러나 일부 상황에서는 동적으로 URL을 변경해야 할 수 있습니다. 예를 들어, 사용자에게 입력받은 값을 기반으로 API 요청을 보내야 하는 경우입니다.

다음은 Axios를 사용하여 동적으로 API URL을 변경하는 예시 코드입니다:

import axios from 'axios';

// 동적으로 변경할 URL을 변수에 저장합니다
const dynamicUrl = 'https://api.example.com/';

// 사용자 입력값을 이용하여 API URL을 동적으로 생성합니다
const userId = '123';
const apiUrl = `${dynamicUrl}/user/${userId}`;

// Axios를 사용하여 API 요청을 보냅니다
axios.get(apiUrl)
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

위의 코드에서는 dynamicUrl 변수에 하드코딩되지 않은 동적으로 변경될 URL을 저장합니다. 그리고 사용자 입력값인 userId 변수를 이용하여 apiUrl 변수를 동적으로 생성합니다.

Axios의 get 메소드를 사용하여 동적으로 생성된 apiUrl로 GET 요청을 보내고, 응답을 받습니다. 응답 데이터는 response.data를 통해 접근할 수 있습니다.

결론

Axios를 사용하여 동적으로 API URL을 변경하는 방법을 알아보았습니다. 이를 활용하여 사용자 입력값 등 다양한 상황에서 유연하게 API 요청을 보낼 수 있습니다. Axios에 대해 더 자세히 알고 싶다면 Axios 공식 문서를 참고해주세요.

#axios #API