使用connect的bodyParser中间件上传文件

1.html

<form action="/" method="POST" enctype="multipart/form-data">
	
	<input type="file" name="hello" multiple="multiple"/>
	<button>Send files!</button> 
<form>

input type = “file”的作用就是可以选择指定一个文件，enctype是指明提提交表单的格式，选择文件后点击Button，提交表单。multiple属性的意思是可以选择多个文件，如

果去掉就只能单选。另外属性名name='hello'是不能去掉的，否则上传文件会不成功。页面如下：

图1

2.服务器代码

var connect = require('connect'); 

var server = connect()
.use(connect.static('public'))
.use(connect.bodyParser())
.use(connect.logger())
.use(function(req,res,next){
	if('POST'== req.method){
		console.log('----------body------------');
		console.log(req.body);
		console.log("----------files-----------");
		console.log(req.files);  
	}else{
		next();
	}
});
server.listen(3000);

在工程目录中新建public，作为存放index.html的目录，bodyParser中间件看似没有发挥作用，但是如果去掉bodyParser，req.body和req.files,都将是undefined。运行结

果如下：

图2

我们发现虽然我们没有给bodyParser指定上传文件存放的路径，但是它自己还是会找个地方存放，应该是个默认地址C盘某处。如上图中”path：“后所指的位置，而且也确实保存了这个文件，并且无扩展名。

在html中指定的name，就是图2中req.files中的file属性，也就是所这两个是同名的，如果name= ‘abc’，这个属性就会是’abc‘

<input type="file" name="hello" multiple="multiple"/>

2.指定路径并返回给浏览器数据

如果我们用浏览器访问127.0.0.1:3000，然后选择一个本地文件，提交表单。我们会发现图1所示的页面会在一段时间后会显示没有收到数据，这是因为，我们没有对前端

进行回应的原因，通俗的将，没有在res中写入任何数据，并调用end();优化后的代码如下：

var connect = require('connect'); 
var fs = require('fs');

var server = connect()
.use(connect.static(__dirname+'/public'))
.use(connect.bodyParser({uploadDir:__dirname +'/file',keepExtensions:true}))
.use(connect.logger())
.use(function(req,res,next){
	if('POST'== req.method && req.files)
	{
		console.log('----------body------------');
		console.log(req.body);
		console.log("----------files-----------");
		console.log(req.files); 
		console.log("--------read file------------");
		fs.readFile(req.files.hello.path,'utf8',function(err,data){
			if(err){
				res.writeHead(500);
				res.end('Error!');
				return;
			}
		res.writeHead(200,{'Content-Type':'text/html'});
		res.end([
			'<h3>File: '  + req.files.hello.name + '</h3>'
			,'<h4>Type: ' + req.files.hello.type + '</h4>'
			,'<h4>Contents:</h4><pre>' + data + '<pre>'
			].join(''));
		});
	}else{
		next();
	}
});

server.listen(3000);

执行这段代码最好将inde.html中的input 中的 multiple属性去掉，因为该代码不具备处理多个文档的能力。代码中我们将上传文件的类型和内容返回给前端，这种就不会有

浏览器显示没有收到数据了。注意代码中我们直接应用req.files.hello，我们知道了属性名是<input name = 'hello'/>，才可以这么写。当然，其实req.files在此情况下也就一个属

性，叫所hello,可以通过 key in req.files的方式判断取出。

最后指出《了不起的Node.js》此段内容有误，req.body.file是不存在的，body中的内容应该是input框中输入实际内容。

参考网页：点击打开链接

参考书目：《了不起的Node.js》