WEB/React

Axios 모듈화

tranzal 2022. 4. 30. 01:07

Axios를 모듈화 하여 사용하기 위해서는 axios.create를 사용하여 공통적으로 사용되는 부분을 만들어준다.

const customAxios : AxiosInstance = axios.create({
    baseURL : `http://localhost:3000`,
    headers: {
        'Content-Type': 'application/json',
    },
})

위와 같이 만들게 되면 customAxios로 호출할 때는 localhost:3000으로 호출을 하고 헤더에 content-Type을 application/json으로 보낸다는 말이다.

 

customAxios를 이용하여 post 또는 get 요청을 하기 위해서는

export const requestPostAxios = (url : string, axiosData : any) => {
    return customAxios.post(url,axiosData)
}

위와 같이 customAxios.post를 이용하면 된다.

 

url 부분은 localhost:3000 뒤에 오는 부분의 url이 들어가는 부분이다.

 

axiosData는 axios호출의 data 부분에 들어가는 부분이다.

 

위 코드에서 post를 get으로 바꾸면 get호출이 가능하다.