본문으로 바로가기

Node.js 기초 - Chapter 09. 파일 업로드

category Front-End/- Node.js 2019. 9. 26. 17:04

1. Formidable 모듈

파일 업로드 모듈 중에 Formidable 가 있다. npm 을 통해 설치 가능하고, 설치가 완료되면 require 메서드를 사용하여

어플리케이션에 포함시킨다.

var formidable = require('formidable');

 

2. 파일 업로드 과정

최종적으로 만들어진 웹페이지를 통하여 파일을 업로드 하고 저장 할 수 있다.

Step 1 : 업로드 폼 생성

HTML 형식으로 된 Node.js 파일을 생성한다.

var http = require('http');

http.createServer(function (req, res) {
	res.writeHead(200, {'Content-Type': 'text/html'});
	res.write('<form action="fileupload" method="post" enctype="multipart/form-data">');
	res.write('<input type="file" name="filetoupload"><br>');
	res.write('<input type="submit">');
	res.write('</form>');
	return res.end();
}).listen(8080);

 

Step 2 : 업로드 된 파일 파싱

일단, Formidable 모듈을 포함시킨다.

파일을 업로드 하거나 파싱할때, 컴퓨터는 임시 폴더를 생성한다.

var http = require('http');
var formidable = require('formidable');

http.createServer(function (req, res) {
	if(req.url == '/fileupload') {
    	var form = new formidable.IncomingForm();
        form.parse(req, function (err, fields, files) {
		res.write('File uploaded');
		res.end();
		});
	} else {
		res.writeHead(200, {'Content-Type': 'text/html'});
		res.write('<form action="fileupload" method="post" enctype="multipart/form-data">');
		res.write('<input type="file" name="filetoupload"><br>');
		res.write('<input type="submit">');
		res.write('</form>');
		return res.end();
	}
}).listen(8080);

 

Step 3 : 파일 저장

파일이 성공적으로 업로드 되었다면, 그것은 임시 폴더에 있을 것이다.

이 임시 폴더의 패스는 parse() 메서드의 callback function에서의  "files" 객체에서 찾을 수 있다.

선택한 폴더의 파일을 옮기기 위해서 파일 시스템 모듈을 사용하고 파일명을 변경해라

var http = require('http');
var formidable = require('formidable');
var fs = require('fs');

http.createServer(function (req, res) {
	if (req.url == '/fileupload') {
		var form = new formidable.IncomingForm();
		form.parse(req, function (err, fields, files) {
			var oldpath = files.filetoupload.path;
			var newpath = 'C:/Users/Your Name/' + files.filetoupload.name;
		fs.rename(oldpath, newpath, function (err) {
        	if (err) throw err;
			res.write('File uploaded and moved!');
			res.end();
		});
	});
  } else {
	res.writeHead(200, {'Content-Type': 'text/html'});
	res.write('<form action="fileupload" method="post" enctype="multipart/form-data">');
	res.write('<input type="file" name="filetoupload"><br>');
	res.write('<input type="submit">');
	res.write('</form>');
	return res.end();
  }
}).listen(8080);