node文件上传功能简易实现代码
找了不少文件上传的相关模块,最后选择了比较常用,并且是express推荐使用的multer来实现文件上传,附上GitHub地址
1.开始
开始第一步,自然就是安装模块,不多说
npminstallmulter--save
这里简单说一下,因为文件上传是用post方法提交数据,所以上传的单文件或者多文件会作为一个body体添加到请求对象中,我们可以通过req.file或者req.files查看上传后文件的相关信息。
以单文件上传为例,req.file返回一个对象:
{ "fieldname":"avatar",#前端上传文件input的name "originalname":"Wx.php",#本地文件名 "encoding":"7bit",#文件编码类型 "mimetype":"text/php",#文件类型 "destination":"uploads/",#上传根目录 "filename":"1497286037422Wx.php",#上传后文件名 "path":"uploads/1497286037422Wx.php",#文件路径 "size":18174#文件大小 }
该对象的key值是固定的,velue值根据配置生成,用于实现相关逻辑
2.实现
实现分两部分,前端和后端
前端
前端就是普通的写法,form表单提交
切记,enctype="multipart/form-data"这个属性一定要加上,否则后台接收不到文件。
后端
首先我们新建配置文件,upload.js
//upload.js varmulter=require('multer');#引入模块 varstorage=multer.diskStorage({ destination:function(req,file,cb){ cb(null,'uploads/') }, filename:function(req,file,cb){ cb(null,Date.now()+file.originalname) } }) varupload=multer({storage:storage}) module.exports=upload;
diskStorage方法相当于创建一个磁盘存储引擎,配置文件上传路径,文件名等,可控性更高。
destination#设置文件上传路径 filename#重命名文件
然后新建路由接收文件,file.js
//file.js varexpress=require('express'); varrouter=express.Router(); //引入配置文件 varupload=require('../config/upload'); router.post('/upload',upload.single('avatar'),function(req,res,next){ res.send(req.file); }); module.exports=router;
file.js中upload.single()方法表示接受单文件,常用的有
upload.single(fname);//接收单文件 upload.array(fname[,maxCount])//接收多文件,maxCount表示接收最大数量
fname是前端
基本的上传文件方法就这些了,当然还有很多的配置参数之类的设置,要参考GitHub说明,地址在开头,需要者自行查阅
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。