Axios Interceptors

유섭·2022년 4월 20일
0

사용이유

  • axios마다 동일한 헤더값, timeout, baseUrl 등 중복처리하기 위해
import axios from 'axios'

const instance = axios.create({
	baseUrl: 데이터를 요청할 기본 주소,
    timeout: 1000
    });
    
instance.interceptors.request.use(
	function (config){
    	// 요청 성공 직전에 호출
        // axios 설정값 추가 가능
    	return config
    }
    function (error){
    	// 요청 에러 직전에 호출
    	return Promise.reject(error)
    }
)

instance.interceptors.response.use(
	function (responce){
    	// 응답 성공 직전에 호출
    	return response
    }
    
   	function (error){
    	// 응답 에러 직전에 호출
    	return Promise.reject(error)
    }
)

export default instance;
  • 사용예시
import 인터셉터 from '인터셉터를 생성경로'

export default {
	get(){
    	return 인터셉터({
        	url:'baseUrl 뒤에 붙는 나머지 주소값',
            method:'get'
        })
    }
    ...

}
import API from '위에 생성한 경로'

const fetchData = async () => {
	try{
    	const responce = API.get()
        ...
    }catch(err){
    	...
    }
}

0개의 댓글

관련 채용 정보

Powered by GraphCDN, the GraphQL CDN