Axios를 사용하여 동적으로 API URL 변경하기
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