[javascript] "GET/HEAD 메서드를 사용한 요청은 본문을 가질 수 없습니다." 해결하기

오류 내용만 보면 "뭔 소린가?" 싶겠지만 정확하게 오류 원인을 설명하고 있습니다.

Failed to execute 'fetch' on 'Window': Request with GET/HEAD method cannot have body.
'창'에서 '가져오기' 실행 실패: GET/HEAD 메서드를 사용한 요청은 본문을 가질 수 없습니다.

 

 

1. 원인

'fetch'를 'GET'이나 'HEAD'로 호출했을 때 바디(body)이 있다면 발생하는 에러입니다.

이 두 메소드는 본문을 가질 수 없고 대신 URL 쿼리로 데이터를 전달합니다.

 

그래서 바디가 있다면 에러가 나게 됩니다.

 

 

2. 해결 방법

인터넷을 뒤져보면 'POST'로 바꾸라는 소리도 나오는데..... 

그건 'REST(Representational State Transfer)'를 어기라는 소리라 해결 방법이 아닙니다.

 

방법은 간단합니다.

'fetch'를 호출하기 전에 바디를 제거하면 됩니다.

 

하지만 여기에도 주의할 점이 있는데

1) 바디를 'undefined'로 설정한다거나

2) 'null'로 설정해도

에러가 납니다.

 

반듯이 오브젝트에서 제거해야 합니다.

//jsonOpt = fetch를 호출할때 사용할 옵션
delete jsonOpt["body"];

 

 

그리고 데이터를 URL쿼리로 변환하여 전달하면 됩니다.

(참고 : github - dang-gun/DotNetSamples/JsFetchApiTest/wwwroot/AjaxAssist2.js )

 

 

 

마무리

이거..... 스택오버플로우에도 이상한 해결 방법이 널렸있는 오류입니다 ㅎㄷㄷ

정확하게 바디를 제거하라는 글도 뒤섞여있는 거 보면 일단 되는 해결 방법이 여러 개여서 그런 게 아닌가 싶네요.