multipart form data
form?
- 입력 양식 전체를 감싸는 태그
- name : form의 이름, 서버로 보내질 때 이름의 값으로 데이터 전송
- action : form이 전송되는 서버 url 또는 html 링크
- method : 전송 방법 설정.
get은 default,post는 데이터를 url에 공개하지 않고 숨겨서 전송- autocomplete : 자동 완성. on으로 하면 form 전체에 자동 완성 허용
- enctype : 폼 데이터(form data)가 서버로 제출될 때, 해당 데이터가 인코딩되는 방법을 명시
enctype 속성값
- application/x-www-form-urlencoded
- default 값으로, 모든 문자들을 서버로 보내기 전에 인코딩됨을 명시
- text/plain
- 공백 문자(space)는 “+”기호로 변환하지만, 나머지 문자는 모두 인코딩되지 않음을 명시
- multipart/form-data
- 모든 문자를 인코딩하지 않음을 명시
- 요소가 파일이나 이미지를 서버로 전송할 때 주로 사용
```html
<form action="/home/uploadfiles" method="post" enctype="multipart/form-data">
파일명 : <input type="file" name="myfile">
<button type="submit">제출하기</button>
</form>
```Multipart가 생긴 배경
HTML의 input의 type중에 “file”이 있음(예 : )
이건 파일 업로드를 위한 input 컨트롤임 → 사용자 컴퓨터에서 서버로 파일을 전송하기 위한 input
form이 submit 되면, form안에 있는 컨트롤들의 데이터가 서버로 전송됨. 이때, 이런 데이터들은 HTTP Request 형태로 서버에 전송됨
파일 업로드의 원리는 HTTP Request가 가지고 있음
- HTTP Request는 Body에 클라이언트가 전송하려고 하는 데이터를 넣을 수 있음
- Body에 들어가는 데이터의 타입을 HTTP Header에 명시해 줌으로써 서버가 타입에 따라 알맞게 처리하게 함
- 이 Body의 타입을 명시하는 Header가
Content-type
보통 HTTP Request의 Body는 한 종류의 타입이 대부분이고, Content-type도 타입을 하나만 명시 가능
[예] text 이면, text/plain, xml이면 text/xml, jpg 이미지이면 image/jpeg 등
일반적인 form의 submit에 의한 데이터들의 Content-type은 application/x-www-form-urlencoded임
그런데 파일 업로드 상황을 보면, 만약 내가 찍은 사진을 올리는 form의 경우, 사진에 대한 설명을 위한 input과 사진 파일을 위한 input 2개가 들어감
→ 이 두 input간에 Content-type은 전혀 다름
→ 사진 설명은 application/x-www-form-urlencoded가 되고, 사진 파일은 image/jpeg임
두 종류의 데이터가 하나의 HTTP Request Body에 들어가야 하는데, 한 Body에서 이 2 종류의 데이터를 구분에서 넣어주는 방법도 필요해짐
→ 이래서 등장한게 multipart
