MIME 타입

MIME 타입은 클라이언트에게 전송된 문서의 형식을 알려주기 위한 메커니즘이다.

웹 서버는 브라우저들이 각 리소스를 내려받았을때 해야할 기본 동작이 무엇인지를 결정하는데 도움을 주기위해 올바른 MIME 타입을 제공 해주어야한다.

 

MIME 타입 외에도 매직 넘버(Magic number)라고 하는 파일을 열면 가장 처음보이는 16진수값들로 파일 형식을 구분할 수 있기도하지만 100% 신뢰할만한 시스템은 아니다.

 - GIF: 47 49 46 38 

 - PNG: 89 50 4E 47

 

# 일반적인 구조

type/subtype

 '/'로 구분된 두개의 문자열인 타입과 서브 타입으로 구성됨. 스페이스는 허용하지 않는다.

 

 

# 대표적인 타입과 서브타입 예시

타입	설명	일반적인 서브타입 예시
text	텍스트를 포함하는 모든 문서를 나타냄	plain, html, css, javascript
image	이미지, 애니메이션되는 이미지도 포함되지만 비디오는 제외.	gif, png, jpeg, bmp, webp
audio	오디오	midi, mepg, webm, ogg, wav
video	비디오	webm, ogg
application	바이너리 문서	octet-stream, pkcs12, xml, pdf

특정 서브타입이 없는 텍스트 문서는 text/plain이 사용되어야 한다.

특정 혹은 알려진 서브타입이 없는 바이너리 문서대해서는 application/octet-stream이 사용되어야한다.

 

# 멀티파트 타입

멀티파트 타입은 여러 MIME 타입들을 지닌, 합성된 문서를 나타내는 방법이다. 2가지만 존재한다.

 - multipart/form-data: HTML Forms와 POST Method 관계 속에서 사용됨

 - multipart/byteranges: Status Code 206 (Partial Contnet)과 함께 사용됨

multipart/form-data
multipart/byteranges

 

# 몇가지 중요한 MIME 타입 자세히 보기

application/octet-stream

이 타입은 바이너리 파일을 위한 기본값이다. 확장자가 잘 알려지지 않은 파일을 의미하므로, MIME 타입이 이렇게 내려오면 브라우저는 보통 자동으로 실행하지 않거나, 실행해야할지 묻기도 한다. 

 

text/html

모든 HLTML 컨텐츠는 이 타입과 함께 서브되어야한다.

 

multipart/form-data

브라우저에서 서버로 HTML Form의 내용을 전송할 때 사용할 수 있다. 이중 대시 '--'로 시작되는 문자열로 구분되어지는 다른 파트들로 구성된다. 각 파트는 그 자체로 개체이며 자신만의 HTTP 헤더를 가지는데, 파일 업로드 필드를 위한 헤더로 Content-Disposition, Content-Type이 있다.

 

아래와 같은 Form이 있다.

유저는 myTextField에 "Test", myCheckBox에 체크를, myFile에 test.txt를 첨부 했다.

<form action="http://localhost:8000/" method="post" enctype="multipart/form-data">
  <input type="text" name="myTextField">
  <input type="checkbox" name="myCheckBox">Check</input>
  <input type="file" name="myFile">
  <button>Send the file</button>
</form>

유저가 버튼을 누르면 브라우저는 다음과 같은 데이터를 서버로 보낼 것이다.

POST / HTTP/1.1
Host: localhost:8000
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:50.0) Gecko/20100101 Firefox/50.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Content-Type: multipart/form-data; boundary=---------------------------8721656041911415653955004498
Content-Length: 465

-----------------------------8721656041911415653955004498
Content-Disposition: form-data; name="myTextField"

Test
-----------------------------8721656041911415653955004498
Content-Disposition: form-data; name="myCheckBox"

on
-----------------------------8721656041911415653955004498
Content-Disposition: form-data; name="myFile"; filename="test.txt"
Content-Type: text/plain

Simple file.
-----------------------------8721656041911415653955004498--

여러가지 형식의 데이터를 합성하여 보냈기 때문에 헤더의 Content-Type은 multipart/form-data;로 지정되어있음을 볼 수 있다. boundary=에 지정된 문자열로 데이터들이 구분된다.

 

데이터들 각각은 고유한 Header 값을 가지며, 예를 들면 첨부한 파일 test.txt의 경우 Content-Disposition, Content-Type이 포함되어있다.

 

---

 

참고자료

https://developer.mozilla.org/ko/docs/Web/HTTP/Basics_of_HTTP/MIME_Types

MIME 타입 - HTTP | MDN