Axios를 사용하여 요청에 타임아웃을 설정하는 방법은 timeout
옵션을 활용하는 것입니다. 이 옵션을 사용하여 요청의 최대 대기 시간을 설정할 수 있습니다. 만약 타임아웃 시간이 초과되면 요청은 실패로 처리됩니다.
다음은 Axios를 활용하여 타임아웃을 설정하는 예시입니다:
import axios from 'axios';
// 타임아웃을 5초로 설정
const timeout = 5000;
axios.get('/api/data', { timeout })
.then(response => {
// 요청이 성공적으로 완료되었을 때 처리할 로직
console.log(response.data);
})
.catch(error => {
// 타임아웃 또는 요청 실패 처리할 로직
if (error.code === 'ECONNABORTED') {
console.log('요청이 타임아웃되었습니다.');
} else {
console.error('요청 실패:', error);
}
});
위의 예시에서는 Axios 요청 설정 객체에 timeout
옵션을 추가하여 타임아웃 시간을 설정합니다. 위 예시에서는 타임아웃을 5초로 설정하였습니다.
요청이 지정된 타임아웃 시간 내에 완료되면 성공적인 응답을 받을 수 있습니다. 그러나 타임아웃 시간을 초과하면 요청은 실패로 처리되며, catch
블록에서 해당 실패를 처리할 수 있습니다. 타임아웃으로 인한 실패는 error
객체의 code
속성이 'ECONNABORTED'
인지 확인하여 구분할 수 있습니다.
위의 예시에서는 GET 요청을 기준으로 설명했지만, 타임아웃 설정은 다른 HTTP 메서드 및 Axios의 다른 요청 메서드에도 적용할 수 있습니다. 타임아웃 설정은 요청에 대한 응답이 너무 오래 걸릴 수 있는 상황에서 유용하게 활용될 수 있습니다.