[React] POST 415 (Unsupported Media Type) error 해결

fetch 를 이용해 body에 JSON 데이터를 담아 서버에 전송하려고 한다
처음에는 formData 를 이용했던 것처럼 똑같이 코드를 써주었다

const Scrap=()=>{

    fetch("url주소", {
      method: "POST",
      cache: "no-cache",
      headers: {
        Authorization: `Bearer ${"access_token"}`,
      },
      body: JSON.stringify({'boardId':id}),
    })
      .then((response) => response.json())
      .then((data) => {
        console.log(data);
    });
  }

전송해야할 key 값과 value 값을 JSON 으로 만들어 body 에 담아 서버에 POST로 전송하였다

그랬더니

POST 415 (Unsupported Media Type)

이러한 에러가 발생했다..! 
찾아보니 서버에서 요청한 media type과 내가 전송한 type이 일치하지 않아 생긴 오류였다.

해결방법은,
json 데이터를 보내는 것이기 때문에

'Content-Type': 'application/json'

이렇게 type을 반드시 명시해주어야한다

const Scrap=()=>{

    fetch("url주소", {
      method: "POST",
      cache: "no-cache",
      headers: {
      	'Content-Type': 'application/json',  
        Authorization: `Bearer ${"access_token"}`,
      },
      body: JSON.stringify({'boardId':id}),
    })
      .then((response) => response.json())
      .then((data) => {
        console.log(data);
    });
  }

이러면 성공적으로 서버에 데이터가 전송이 된다!

---

formData를 이용하여 서버에 전송할 때는 헤더에  'Content-Type' 을 작성하면 오히려 런타임 에러가 발생했고, 주석 처리를 해주었더니 정상적으로 작동했다
왜 두 가지가 이런 차이가 있는지는.. 좀 더 알아봐야겠다