文件上传是很常见的实用功能。
本文演示如何用Express实现文件上传功能。
例程
本例需要两个文件及一个目录
test39.js:主程序;
index.html:用于上传文件的前端页面;
temp_folder:存放被上传的文件。
test39.js:
var express = require('express');
var app = express();
//form表单需要的中间件。
var mutipart= require('connect-multiparty');
var mutipartMiddeware = mutipart();
//临时文件的储存位置
app.use(mutipart({uploadDir:'./temp_file'}));
app.set('port',process.env.PORT || 8000);
app.listen(app.get('port'),function () {
console.log("Express started on http://localhost:"+app.get('port')+',press Ctrl-C to terminate.');
});
//浏览器访问localhost会输出一个html文件
app.get('/',function (req,res) {
res.type('text/html');
res.sendFile(__dirname+'/index.html')
});
//这里就是接受form表单请求的接口路径,请求方式为post。
app.post('/upload',mutipartMiddeware,function (req,res) {
//这里打印可以看到接收到文件的信息。
console.log(req.files);
//成功接受到浏览器传来的文件。我们可以在这里写对文件的一系列操作。例如重命名,修改文件储存路径 。等等。
//给浏览器返回一个成功提示。
res.send('upload success!');
});
index.html:
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="/upload" enctype="multipart/form-data" method="post">
<p>附件:<input type="file" name="myfile"></p>
<p><input type="submit"></p>
</form>
</body>
</html>
执行
启动test39,访问本机8000端口,
选择一个文件,并进行提交。
后台会显示出上传文件内容:
提交后,前端页面会显示上传成功。
来到temp_folder目录,查看被文件的文件:
文件上传成功。