나아가는 길에 발자국을 찍어보자

Axios GET요청에는 Body가 없다 본문

javascript && vue.js

Axios GET요청에는 Body가 없다

NAWIN 2020. 10. 6. 18:23
반응형

"Axios GET요청에는 Body가 없다"

아주 기본적이지만 그 기본적인 것을 몰라 헤맸었다..

 

자꾸 서버에서

[org.springframework.http.converter.HttpMessageNotReadableException: Required request body is missing

이런 에러가떠서....난 바디를 잘넣어서 요청을 보냈건만....post man에서는 잘 응답해놓고 왜 프론트쪽에서 요청하는것은 에러가 나는 거지하고 머리를 싸맸다..

 

결론은 내가 무지했다는 것이다 ㅜㅜㅜㅜㅜ흑

 

개인적으로 공부하면서 느낀 아쉬움은 내가 현재 배우고있는 습관이나 환경은

밑바닥부터 차근차근 배우는 것 아니라 우선 만들어! 그리고 오류나면 고쳐! 이런 느낌이라는 것인데,

그렇기 때문에 새로 배우는 내용을 꼼꼼하게 공부한다기 보단 일단 적용해 보고 쓰는대로 체득하고 있는 상황이다.

이게 빠르게 배울수있다고 누군가는 말하고 좋은 방법이다라고 할진 모르겠지만 가끔 알고 있고 사용할줄알지만 기초적인 내용이나 어떠한 것을 놓치고 넘어가 발목을 잡을 때 단점이 극명하게 나타나는 것 같다.

 

선호하는 방식은 처음부터 배워나가는 방식이지만(학생때는 항상 맨앞장부터 꼼꼼하게 읽으면서 공부했었더랬지...) 컴퓨터 공부라는게 항상 그게 옳지는 않다라는 것을 느끼고, 상황에 쫒기기도 하고 또한 업무를 하면서 기존의 방식에서 지금의 방식으로 많이 바꿨다. 하지만 이렇게 가끔 지나왔던 길에 구멍이 있다는 것을 인식 할때는 조금 진한 아쉬움이 남는다.

 

뭐 어쨌든 지금 이라도 채워넣으면 되겠지하는 마음으로 정리를 해보도록 하겠다.


API 기본요청

1.axios() 사용시

axios({
  url: '/user/12345',
  method: 'put',
  data: {
    firstName: 'Fred',
    lastName: 'Flintstone'
  }
})

=> 헤더나 파라미터도 중간에 추가해서 요청하면 된다!

axios({
  url: '/user/12345',
  method: 'put',
  data: {
    firstName: 'Fred',
    lastName: 'Flintstone'
  },
  headers: { 'X-Requested-With': 'XMLHttpRequest' },
  params: {
    ID: 12345
  }
})

 

2. 별칭 사용시

axios.get(url[, config])            // GET
axios.post(url[, data[, config]])   // POST
axios.put(url[, data[, config]])    // PUT
axios.patch(url[, data[, config]])  // PATCH
axios.delete(url[, config])         // DELETE

axios.request(config)
axios.head(url[, config])
axios.options(url[, config])

(ex)

axios.put('/user/12345', {
  firstName: 'Fred',
  lastName: 'Flintstone'
})

=> 보면 알겠지만 get요청에는 data를 넣지 않는다ㅜㅜ (== body가 없다.)

 

3. 여러 요청을 동시에 할때

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
  }));

 

 

[출처]

https://xn--xy1bk56a.run/axios/guide/api.html

 

반응형
Comments