[Axios] query를 보내고 싶은 그대, 이것만 기억하기

 

 

 

query 그거 어떻게 하는건데?

백엔드 개발자가 axios를 쓴 이유가 뭐냐고 궁금해 할 수 있다.

단일 레포 즉, Monolithic 서비스라면 axios를 백엔드에서 사용할 이유가 없을테지만,

MSA로 서비스를 운영해야한다면 나눠진 A라는 서비스에 B라는 서비스가 통신하기 위해서 axios를 사용할 수 있다.

 

현재 우리 회사에서는 MSA와 클라우드 아키텍처로 인해 axios를 사용하고 있고,

API를 전적으로 담당하는 나는 점점.. axios 장인이 되어가고 있다 🤣

 

이번에는 axios에서 query를 보내고 싶을 때 어떻게 하는지 알아보도록 하자.

 

 

 

{ params: } 필수

body나 param을 보낼때는 그리 신기하지 못해 포스팅 할 필요성을 못느꼈다.

하지만 query는 익숙하지 않아 잘 까먹겠다는 생각을 했다.

 

    await axios
      .get(`http://localhost:2000/test`, { params: { id: 123 } })

위와 같이 params를 넣어 객체에 query를 넣어주면 서버에서는 req.query.id로 조회해서 123이라는 데이터를 얻을 수 있다.

포스트맨으로 따지면 localhost:2000/test?id=123 인 것이다.

서버 개발자의 경우 대체로 포스트맨 같은 툴을 이용해서 API 테스트를 한다.

그래서 localhost:2000/test?id=123 식으로 보내는게 익숙한 사람들이다 보니 axios의 방식이 생소했다.

 

그럼 localhost:2000/test/:id 즉, params는 어떻게 axios로 보낼까?

그건 매우 쉽다.

const key = 'sldjflsdlld'
await axios
      .get(`http://localhost:2000/test/${key}`, { params: { id: 123 } })

포스트맨에서 사용하는 방식과 동일해서 외울 필요는 없다.

서버에서 req.params.key를 조회하면 sldjflsdlld 가 나온다.

 

 

 

 

fin.