express后台接收文件以及jquery前端上传文件的方法

在H5开发和利用express写项目的时候经常会遇到需要上传文件的情况,这里整理了一下比较好用的方法方便大家参考:

首先是jquery上传文件:

这里调用接口使用的是ajax的方法,首先是创建需要上传的数据,使用formdata来创造上传的数据:

var data = new FormData();
data.append('file', myFile);
$.ajax({
    url: yourUrl,
    data: data,
    contentType: false,
    processData: false,
    type: 'POST',
    success: function (result) {
        console.log(result);
    },
    error: function (err) {
        console.error(err);
    }
});

这里的myFile是一个File对象,可以是input中选择得到的file,yourUrl为后端接收上传文件的接口;

然后是express后台接收文件的接口:

接收文件一个比较好用的nodejs库为connect-busyboy,这个库使用起来比较方便,首先在你的app.js里面应用这个库:

let busboy = require('connect-busboy');
app.use(busboy());
当有文件上传时这个库会在request中加入一个名为busboy的属性,通过这个属性可以接收并保存文件,在你的路由接口中可以这样操作:

if (req.busboy) {
    req.busboy.on('file', function (fieldname, file, filename, encoding, mimetype) {
    	var saveTo = path.join(__dirname.replace('routes', 'static'), yourFileName);           
    	file.pipe(fs.createWriteStream(saveTo));
    	file.on('end', function () {
       		//在这边可以做一些数据库操作
        	res.json({
            	success: true
        	});
    	});
    });
    req.pipe(req.busboy);
}


这样就实现了文件的上传功能

你可能感兴趣的:(nodejs,后台学习笔记,jquery)