Content-Type

1. Content-Type header

---

Content-Type header는 현재 request 혹은 response의 body에 들어 있는 데이터가 어떤 타입인지를 나타낸다.

Content-Type header의 값은 '주 타입(main type)/서브 타입(sub type)'의 형식으로 나타낸다.

1. 주 타입이 text인 경우 (텍스트)
- 일반 텍스트 : text/plain
- CSS 코드 : text/css
- HTML 코드 : text/html
- JavaScript 코드 : text/javascript
2. 주 타입이 image인 경우 (이미지)
- bmp 이미지 : image/bmp
- git 이미지 : image/gif
- png 이미지 : image/png
3. 주 타입이 audio인 경우 (오디오)
- mp4 오디오 : audio/mp4
- ogg 오디오 : audio/ogg
4. 주 타입이 video인 경우 (비디오)
- mp4 비디오 : video/mp4
- H264 비디오 : video/H264

위 타입들에 속하지 않는 것들은 보통 application이라고 하는 주 타입에 속한다.

5. 주 타입이 application인 경우
- JSON 데이터 : application/json
- 확인되지 않은 바이너리 파일 : application/octet-stream

여기서 바이너리 파일이란 보통 텍스트 파일 이외의 파일들을  말한다. 이 바이너리 파일들 중에서도 png, mp4 등 특정 확장자의 포맷에 해당하지 않는 데이터들을 보통 application/octet-stream으로 나타내는 것이다.

 

Content-Type header는 왜 필요할까? 그것은 바로 Content-Type header가 존재하면 body의 데이터를 직접 확인해서 그 타입을 추론하지 않아도 되기 때문이다.

따라서 request든 response든 body에 어떤 데이터가 존재한다면 Content-Type header의 값을 적절하게 설정해주는 것이 좋다.

 

 

2. Content-Type 설정해보기

---

const newMember = {
  name: 'Adam',
  email: 'adamsmith@gmail.com',
  department: 'engineering',
 };
 
 fetch('http://www.google.com', {
   method: 'POST',
   
   headers: {
     'Content-Type': application/json',
   },
   
   body: JSON.stringify(newMember),
 });
   .then((response) => response.text())
   .then((result) => { console.log(result); });