Axios를 사용하여 요청을 취소하는 방법은 CancelToken
을 활용하는 것입니다. CancelToken
은 Axios에서 제공하는 기능으로, 요청을 취소할 수 있는 토큰을 생성하고 이를 활용하여 요청을 취소할 수 있습니다.
다음은 Axios를 활용하여 요청을 취소하는 예시입니다:
import axios from 'axios';
// 요청 취소용 CancelToken 생성
const source = axios.CancelToken.source();
// Axios 요청 설정 객체에 cancelToken 속성 추가
axios.get('/api/data', { cancelToken: source.token })
.then(response => {
// 요청이 성공적으로 완료되었을 때 처리할 로직
console.log(response.data);
})
.catch(error => {
// 요청이 취소되었거나 실패했을 때 처리할 로직
if (axios.isCancel(error)) {
console.log('요청이 취소되었습니다:', error.message);
} else {
console.error('요청 실패:', error);
}
});
// 요청 취소
source.cancel('사용자에 의해 요청이 취소되었습니다.');
위의 예시에서는 axios.CancelToken.source()
를 사용하여 CancelToken
객체와 그에 따른 취소 토큰을 생성합니다. 그리고 Axios 요청 설정 객체에 cancelToken
속성을 추가하여 취소 토큰을 전달합니다. 요청을 취소하기 위해서는 source.cancel()
메서드를 호출하고, 선택적으로 취소 메시지를 전달할 수 있습니다.
또한, 요청이 취소되었는지 여부를 확인하기 위해 axios.isCancel()
함수를 사용하여 에러 객체를 체크할 수 있습니다. 이를 통해 취소된 요청인지 아닌지를 구분하여 처리할 수 있습니다.
이와 같이 Axios의 CancelToken
을 활용하면 요청을 취소할 수 있으며, 이는 비동기 작업을 중단하고 불필요한 응답을 처리하지 않도록 도와줍니다.