[TIL] 내일배움캠프 12.15

Asher Park·2022년 12월 16일
2

내일배움캠프_TIL

목록 보기
17/39
post-thumbnail

하루

개인과제를 위해 강의를 열심히 듣고,

개인과제는 사실 백엔드만 만들면 되는 것이었지만 React를 이용하여 프론트까지 만들어보기로 하였다.

짧은 시간내에 화면 구성과 디자인도 살짝 해야해서 힘들었지만 오랜만에 풀스택으로 개발해봐서 재미있기도 했다.


TIL

우리가 구현해야하는 API인 게시글 삭제댓글 삭제 기능을 구현하려고 하는데,

내가 아는 RESTful CRUDDELETEbody data를 넘길 수 없다고 알고 있었다.

axios.delete("/api/comments/delete?id=" + commentId + "&password=" + password)

그래서 위의 코드처럼 query string 형식으로 댓글 id값과 삭제 하기위해 입력한 비밀번호를 넘겼다.

그러다 Postman으로 테스트를 한번 해보는데,

DELETE Method로 body에 password를 담아 보내보았는데... 성공을...?

왜... 왜지? 나는 DELETE는 body를 못보낸다고 알고있었는데...?

그래서 나는 POST 처럼 body에 담아서 넘겨보았다.

let body = {
	password: password
}

axios.delete("/api/comments/delete?id=" + commentId, body)

왜 서버에서 못받지? 왜 undefined일까?

서버에서 계속 password가 undefined인것이 아닌가?

많은 고민을하면서 구글링을하고 튜터님께 도움도 받은 결과!

일단 CRUD의 모든 Method는 어떻게든 데이터를 실어 보낼 수 있다!!!!

But,

안티패턴 컨벤션인 것이다.

GET Method는 단순히 가져오는 역할만 하므로 상태를 변형 시키기위해 데이터를 전달 받지 않는 관습? 협약?

DELETE Method도 당연하다. 그저 삭제만을 위한 Method 이므로 사용목적에 맞는 관례? 관습? 협약? 인 것이다.

Axios docs

내가 사용한 Axios의 공식 docs를 살펴보면,

POST, PUT, PATCH, DELETE 다 Body data를 받을 수 있지만?

POST, PUT, PATCH는 다음과 같은 형식으로 지원을 하고,

axios.post(url[, data[, config]])

axios.put(url[, data[, config]])

axios.patch(url[, data[, config]])

DELETE는 다음과 같은 형식으로 지원한다.

axios.delete(url[, config])

GET도 마찬가지이다.

그래서 DELETE Method를 사용하면서 Body에 데이터를 담아 보내기 위해서는?

axios.delete('/comments', { data: { body에 들어갈 객체} });

이런식으로 사용할 수 있지만, 권장하지 않는 방법이다!

profile
배움에는 끝이없다

0개의 댓글