axios 여러개 요청하기 (멀티 리퀘스트)

axios를 사용하다보면

 

get도 그렇고 post도그렇고

 

한번에 여러 api요청을 보내야 할 때가 있다.

 

그때마다 그냥 2~3거나 1~2개면 useEffect를 두번쓰거나해서 가져오곤 했지만

 

그냥 한번에 멀티리퀘스트를 보내는 방법이 있다.

 

axios.all을 사용하는 것이다.

 

function getUserAccount() {
  return axios.get('/user/12345');
}

function getUserPermissions() {
  return axios.get('/user/12345/permissions');
}

axios.all([getUserAccount(), getUserPermissions()])
  .then(axios.spread(function (acct, perms) {
    // Both requests are now complete
  }));

in React

function getUserAccount() {
  return axios.get('/user/12345');
}

function getUserPermissions() {
  return axios.get('/user/12345/permissions');
}

useEffect(()=>{

axios.all([getUserAccount(), getUserPermissions()])
  .then(axios.spread(function (acct, perms) {
    // Both requests are now complete
  }));
  
},[])

물론 2개뿐 아니라 3,4,5개 늘려서 사용도 가능하다.

 

하지만 멀티 리퀘스트를 보내야 하는 상황자체가 좋은건 아니라고 한다.

 

클라이언트 단에서 api요청은 언제나 최소화!

 

여튼 참고하자

 

-참고한 링크

https://yamoo9.github.io/axios/guide/usage.html#post-%EC%9A%94%EC%B2%AD

사용법 | Axios 러닝 가이드

https://baegofda.tistory.com/215

🎏 requset 여러개 요청하기 (with Axios multiple request)