[O'REILLY] Node & Express - 8장 : 폼 처리 - 3 (파일 업로드)

1. 파일 업로드

- 멀티파트 폼 처리에 주로 쓰이는 패키지는 버스보이, 멀티파티, 포미더블, 멀터 등이 있다. (채신기술 모름)

- 멀티파티와 멀터가 좋다고 하는데 뭐 사용자 나름이다.

- 파일 업로드를 활성화하기 위해서는 반드시 enctype="multipart/form-data" 를 사용해야 한다.

 

예시

다양한 데이터를 보내는 html - form

- accept 옵션을 통해 파일의 타입을 제한할 수 있다. (실제로 강제하는 것은 아니다)

- 이제 서버에서 post요청을 처리해보자.

vacation어쩌고 핸들러는 다른 곳에서 가져올 것이다.

- 멀티파티의 parse 메서드를 사용하여 요청 데이터를 데이터 필드와 파일로 분석한다.

- 이 메서드는 파일을 서버의 임시 디렉터리에 저장하며, 그 정보를 files 배열로 반환한다.

- 라우트 핸들러에 넘길 정보를 알게 되었으니, 라우트 핸들러를 작성한다.

요로코롬

- 주의 : 파일을 저장소에 업로드하는 것이 좋다. 로컬에 계속 저장하다보면 확장성에 문제가 생기기 때문이다.

 

2. fetch를 통한 파일 업로드

- fetch 를 사용해 업로드하는 것은 브라우저가 처리하도록 맡기는 것과 같다.

- 인코딩을 미들웨어에서 처리하기 때문이다.

 

클라이언트에서 폼처리 예시

then catch 극혐

 

3. 프론트에서 쓰이는 파일 업로드 UI 개선 라이브러리

- 제이쿼리 파일 업로드

- 어피

- 파일 업로드 윗 프리뷰

 

4. 정리하기

- application/x-www-form-urlencoded : 일반적으로 전통적인 폼 처리에 활용되는 인코딩 방법

- application/json : fetch를 통해 파일이 아닌 데이터를 보낼 때 널리 쓰임

- multipart/form-data : 파일을 전송할 때 사용하는 인코딩

 

 

- 다음시간엔 쿠키와 세션!