[typescript] REST API 호출 시 에러 핸들링 방법

12 Dec 2023

typescript

이번에는 TypeScript를 사용하여 REST API를 호출하고, 발생할 수 있는 에러를 어떻게 처리하는지에 대해 알아보겠습니다.

1. Axios를 사용한 API 호출

먼저, Axios를 사용하여 REST API를 호출하는 방법을 살펴보겠습니다.

import axios from 'axios';

try {
  const response = await axios.get('https://api.example.com/data');
  console.log(response.data);
} catch (error) {
  console.error('API 호출 중 에러 발생:', error);
}

위 예제에서는 axios.get을 이용하여 API를 호출하고, 성공할 경우 응답 데이터를 출력하고, 에러가 발생할 경우에는 해당 에러를 콘솔에 출력하는 방식으로 처리하고 있습니다.

2. 에러 핸들링

에러 핸들링을 더 세밀하게 처리하기 위해서는 try-catch 구문을 이용할 수 있습니다. 또는 Axios의 interceptor를 사용하여 전역적으로 에러를 처리하는 것도 좋은 방법입니다. 예를 들어, 다음과 같이 Axios의 interceptor를 활용하여 모든 API 호출에 대한 에러를 처리할 수 있습니다.

axios.interceptors.response.use(
  response => {
    return response;
  },
  error => {
    console.error('API 호출 중 에러 발생:', error);
    return Promise.reject(error);
  }
);

결론

이렇게 TypeScript로 REST API를 호출하면서 발생할 수 있는 에러를 효과적으로 핸들링하는 방법에 대해 알아보았습니다. try-catch 구문을 사용하거나 Axios의 interceptor를 활용하여 전역적으로 에러를 처리하는 방법을 적절히 선택하여 개발 효율성을 높이는 것이 중요합니다.

참고 문헌:

Axios 문서: https://github.com/axios/axios
TypeScript 문서: https://www.typescriptlang.org/docs/