Axios는 JavaScript에서 널리 사용되는 HTTP 클라이언트 라이브러리입니다. Axios를 사용하여 서버로의 HTTP 요청을 보낼 때, 가끔 요청이 실패할 수 있습니다. 이러한 경우, 에러 핸들링을 통해 어떻게 대응해야 할지 알아보겠습니다.
1. 예외 처리 방법
Axios는 Promise 기반의 API를 제공하므로, then/catch 구문을 사용하여 요청 결과를 처리할 수 있습니다. 예를 들어, 다음과 같이 요청을 보내고자 할 때:
axios.get('/api/data')
.then(response => {
// 성공적인 응답 처리
console.log(response.data);
})
.catch(error => {
// 에러 핸들링
console.error(error);
});
then에서는 성공적인 응답을 처리하고, catch에서는 에러를 핸들링합니다. 이를 통해 서버로의 요청이 실패한 경우 예외 처리를 할 수 있습니다.
2. HTTP 상태 코드 확인
Axios에서는 응답 객체의 status 속성을 통해 HTTP 상태 코드를 확인할 수 있습니다. 이를 통해 서버로의 요청이 성공했는지, 혹은 어떤 에러가 발생했는지 확인할 수 있습니다. 예를 들어, 404 상태 코드는 “Not Found” 에러를 의미하며, 500 상태 코드는 “Internal Server Error” 에러를 의미합니다. 아래는 상태 코드에 따른 예외 처리 예시입니다:
axios.get('/api/data')
.then(response => {
if (response.status === 200) {
// 성공적인 응답 처리
console.log(response.data);
} else {
// 상태 코드에 따른 예외 처리
console.error('서버로부터 올바른 응답을 받지 못했습니다.');
}
})
.catch(error => {
// 전체적인 에러 핸들링
console.error(error);
});
3. 에러 메시지 확인
Axios에서는 응답 객체의 error 속성을 통해 에러 메시지를 확인할 수 있습니다. 에러 메시지에는 대부분의 경우 실제 발생한 예외 메시지가 담겨있으며, 이를 통해 어떤 에러가 발생했는지 상세히 파악할 수 있습니다. 예를 들어, 다음과 같이 에러 메시지를 출력할 수 있습니다:
axios.get('/api/data')
.then(response => {
console.log(response.data);
})
.catch(error => {
console.error('에러 발생:', error.message);
});
이를 통해 개발자는 Axios를 사용하여 서버 요청 중에 발생한 에러를 더 잘 이해하고, 적절한 처리를 할 수 있습니다.