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
Fetch API는 HTTP 파이프라인을 구성하는 요청과 응답 등의 요소를 JavaScript에서 접근하고 조작할 수 있는 인터페이스를 제공합니다. Fetch API가 제공하는 전역 fetch() 메서드로 네트워크의 리소스를
developer.mozilla.org
https://developer.mozilla.org/en-US/docs/Web/API/FormData
FormData - Web APIs | MDN
The FormData interface provides a way to construct a set of key/value pairs representing form fields and their values, which can be sent using the fetch(), XMLHttpRequest.send() or navigator.sendBeacon() methods. It uses the same format a form would use if
developer.mozilla.org
https://wildeveloperetrain.tistory.com/304
x-www-form-urlencoded 타입이란 (multipart/form-data와의 차이점)
x-www-form-urlencoded와 multipart/form-data 차이점 //기존에 설정된 springdoc consumes default-consumes-media-type: multipart/form-data //변경된 설정 default-consumes-media-type: application/x-www-form-urlencoded 프로젝트 작업 중 동
wildeveloperetrain.tistory.com
https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types
MIME types (IANA media types) - HTTP | MDN
A media type (also known as a Multipurpose Internet Mail Extensions or MIME type) indicates the nature and format of a document, file, or assortment of bytes. MIME types are defined and standardized in IETF's RFC 6838.
developer.mozilla.org
'⭐FE' 카테고리의 다른 글
| project별로 prettier 설정하기 ( vscode ) (0) | 2023.12.18 |
|---|---|
| 예외 처리 방법 ( throw, Error 이용 ) (1) | 2023.11.30 |
| 비즈니스 로직 어떻게 분리할까? (1) | 2023.11.23 |
| Object.is() 개념잡기 (0) | 2023.11.21 |
| React useState 호출 시 무조건 렌더링 된다? (0) | 2023.11.19 |