http request 의 content-type이해하기

Content-type 이란? 

Content-type은 우리가 fetch나 axios를 이용하여 server에 request를 보낼 때 body 에 담아 보내는 data의 유형을 명시하기 위해 존재하며 헤더에 담긴다. 그러므로 Content-type에 명시된 유형과 data의 유형이 같아야한다. 

 

주요 Content-type 

1. "application/json"  

- 요즘 대부분 data 형식을 json으로 쓰다보니 application/json이 대부분이며 axios 의 기본 default content-type이 appliaction/json 으로 알고 있다. 

-   restful api 를 사용하게 되며 request를 날릴 때 대부분 json을 많이 사용하게 됨에 따라 자연스럽게 사용이 많이 늘었음.

 

2. application/x-www-urlencoded

- html의 form의 기본 Content-Type으로 요즘은 자주 사용하지 않지만 여전히 사용하는 경우가 존재

- body의 data를 url에 encoding 하여 실어 보낸다 

-모든 브라우저에서는 application/x-www-form-urlencoded content-type에 대해 body의 데이터를 자동으로 encoding한다.

- application/x-www-form-urlencoded 방식은 인코딩 과정이 들어가기 때문에 대량의 데이터를 보내는 것에는 적합하지 않음

 

3. "multipart/form-data"

- 서로 다른 두 개의 content-type을 가진 데이터를 하나의 HTTP Request Body에 보내야 할때 사용 

- 파일이나 이미지를 그에 대한 설명을 담은 text와 함께 form에 담아서 보낼 시 text는 application/x-www-form-urlencoded 형태로 파일이나 이미지는 image/png 형식으로 보내질 때 여러가지의 데이터 형식이 혼재되어 있음을 나타내는 content-type: multipart/from-data 를 사용한다. 

 

참고

https://developer.mozilla.org/ko/docs/Web/API/Fetch_API/Using_Fetch

Fetch API 사용하기 - Web API | MDN

https://developer.mozilla.org/en-US/docs/Web/API/FormData

FormData - Web APIs | MDN

https://wildeveloperetrain.tistory.com/304

x-www-form-urlencoded 타입이란 (multipart/form-data와의 차이점)

https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types

MIME types (IANA media types) - HTTP | MDN