Axios는 자바스크립트에서 많이 사용되는 HTTP 클라이언트 라이브러리로서, HTTP 요청을 보내고 응답을 받을 수 있습니다. Axios 인터셉터는 요청과 응답을 가로채고 수정하는 기능을 제공합니다. 이를 통해 전역적으로 요청과 응답을 처리하거나, 각 요청별로 다른 설정을 추가할 수 있습니다.

요청 인터셉터

Axios의 요청 인터셉터는 axios.interceptors.request 객체를 사용하여 설정할 수 있습니다. 이 객체에는 use 메서드를 사용하여 요청 전에 수행할 작업을 등록할 수 있습니다. 예를 들어, 아래 코드는 모든 요청에 대해 헤더를 추가하는 인터셉터를 설정하는 예시입니다.

axios.interceptors.request.use(function (config) {
  config.headers['Authorization'] = 'Bearer token123';
  return config;
});

응답 인터셉터

응답 인터셉터는 axios.interceptors.response 객체를 사용하여 설정할 수 있습니다. 마찬가지로, use 메서드를 사용하여 응답을 가로채고 처리할 작업을 등록할 수 있습니다. 아래 코드는 모든 응답에 대해 응답 데이터를 가공하는 인터셉터를 설정하는 예시입니다.

axios.interceptors.response.use(function (response) {
  // 응답 데이터 가공 로직을 작성합니다.
  return response.data;
});

인터셉터 해제

인터셉터를 제거하려면 eject 메서드를 사용하면 됩니다. 해당 인터셉터 객체를 얻고, eject 메서드를 호출하면 인터셉터가 해제됩니다.

var myInterceptor = axios.interceptors.request.use(function () {/*...*/});
axios.interceptors.request.eject(myInterceptor);

Axios 인터셉터를 사용하면 요청과 응답을 가로채고 처리하는 기능을 간단하게 구현할 수 있습니다. 이를 통해 전역적인 설정이나 각각의 요청에 대한 추가적인 처리를 쉽게 구현할 수 있습니다.

더 자세한 내용은 Axios 공식 문서를 참고하시기 바랍니다.