express框架实现文件上传服务器

express有个很好用的生成器：express-generator，通过npm install express-generator -g安装。

安装成功后，express testapp 命令，生成testapp 项目脚手架

cd testapp 进入testapp 目录，npm install命令安装依赖包，时间会有点长

1.routes目录下新增路由：uploader.js,代码如下：

//引入http
const http=require("http");
//引入express
const express=require("express");
//引入multer
const multer=require("multer");
/*var server=http.createServer(app);*/
var router = express.Router();

//建立public文件夹，将HTML文件放入其中，允许访问
//router.use(express.static("public"));
//文件上传所需代码
//设置文件上传路径和文件命名
var storage = multer.diskStorage({
    destination: function (req, file, cb){
        //文件上传成功后会放入public下的upload文件夹
        cb(null, '../public/upload')
    },
    filename: function (req, file, cb){
        //设置文件的名字为其原本的名字，也可以添加其他字符，来区别相同文件，例如file.originalname+new Date().getTime();利用时间来区分
          cb(null, file.originalname)
    }
});
var upload = multer({
    storage: storage
});

//处理来自页面的ajax请求。single文件上传
router.post('/upload', upload.single('file'), function (req, res, next) {
    //拼接文件上传后的网络路径
	console.log("file:"+req.file.originalname)
    var url = 'http://' + req.headers.host + '/upload/' + req.file.originalname;
  
    res.end(req.file.originalname);
});

// 单域多文件上传：input[file]的 multiple=="multiple"
router.post('/upload', upload.array('file', 5), function(req, res, next) {
    // req.files 是 前端表单name=="imageFile" 的多个文件信息（数组）,限制数量5，应该打印看一下
    var fileName = ""
    for (var i = 0; i < req.files.length; i++) {
        // 图片会放在uploads目录并且没有后缀，需要自己转存，用到fs模块
        // 对临时文件转存，fs.rename(oldPath, newPath,callback);
        fileName+=req.files[i].originalname+";"
        fs.rename(req.files[i].path, "upload/" + req.files[i].originalname, function(err) {
            if (err) {
                throw err;
            }
            console.log('done!');
        })
    }


    res.writeHead(200, {
        "Access-Control-Allow-Origin": "*"//允许跨域。。。
    });
      // req.body 将具有文本域数据, 如果存在的话
//  res.end(JSON.stringify(req.files)+JSON.stringify(req.body));
	console.log("fileName:"+fileName)
	res.end(fileName)
})


module.exports = router;

其中使用了multer包，所以要安装multer：npm install multer;然后public下需要新建upload文件夹

下面将这个路由引入到app.js中

var multerUploadRouter = require('./routes/multerUploader');

var allowCrossDomain = function (req, res, next) {
   	res.header('Access-Control-Allow-Origin', '*');//自定义中间件，设置跨域需要的响应头。
   	res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header('Access-Control-Allow-Headers', 'Content-Type');
   	next();
};
app.use(allowCrossDomain);//运用跨域的中间件

app.use('/multerUpload', multerUploadRouter);

app.use(bodyParser.json({limit:'50mb'}));
app.use(bodyParser.urlencoded({limit:'50mb',extended:true}));

下面在前台就可以通过ajax上传啦

var files = $('#file_id')[0].files;
var file = files[0];
formData = new FormData();
formData.append('file',file);
formData.append('type',".jpg");
reqUrl= 'http://localhost:3000/multerUpload/upload'
$.ajax({
    type: "Post",
    url: reqUrl,
    data: formData,  
    processData:false,
    contentType:false,
    dataType: "text",
    xhr: function() {
	 var myXhr = $.ajaxSettings.xhr();
	 return myXhr;
    },
   success: function(file_path) {
	console.log("file_path:"+file_path)
	if(file_path) {
		alert("文件上传成功")
		} 
	},
   error: function(err) {
			
		}
	});