[Web] Multipart/form-data

Multipart/form-data란?

모든 문자를 인코딩하지 않고 특정한 문자열을 이용해 form-data의 각 요소들의 내용을 구분하는 방식이다. 주로 form 태그에서 파일을 서버로 전송할 때 사용한다. 이런 데이터 전송방식이 등장한 이유는 무엇일까? 이에 대해 이해하기 위해선 Content-type이 무엇인지부터 알아야한다. HTTP Request는 body에 전송하려는 데이터를 담으며, 담은 데이터의 타입을 HTTP Header에 명시하는데 이 Header가 Content-type이다. 보통 HTTP Request의 body에 담는 데이터는 한 종류이기 때문에 Content-type도 하나만 명시할 수 있다. 하지만 이미지 파일을 업로드할 때 이미지 파일에 대한 설명도 같이 전송해야되는 경우는 어떻게 처리해야 할까? form 태그의 method를 post로 설정한 경우 enctype의 default 값은 application/x-www-form-urlencoded 이다. 

 

<form action="" method="post">
    //...
</form>

<form action="" method="post" enctype="application/x-www-form-urlencoded">
     //...
</form>

 

따라서 이미지 파일에 대한 설명의 Content-type은 application/x-www-form-urlencoded 이지만, 이미지 파일의 Content-type은 image/확장자의 형태로 body에 담아야하는 데이터가 두 종류가 된다. 즉, body에 두 가지 Content-type을 구분해서 담아줘야할 필요가 생기게 된다. 이를 해결하기위해 multipart/form-data이 등장하게 된다.

 

multipart/form-data는 'Content-type:multipart/form-data; boundary=--------------------[특수한문자열]'의 형태로 Content-tpye을 저장하고 boundary의 값을 이용해 각 데이터를 구분한다.

 

---------------------------[특수한문자열]
Content-Disposition:form-data;name="test"

---------------------------[특수한문자열]
Content-disposition:form-data;name="image";filename="test.jpeg"
Content-Type: image/jpeg

(binary 이미지데이터)

 

참고자료

[블로그1] [블로그2]

[youtube 강의]