当前位置: 首页 > 后端技术 > Node.js

【node】文件上传功能很容易实现

时间:2023-04-03 11:21:48 Node.js

找了很多文件上传的相关模块,最后选择了multer这个express比较常用和推荐的实现文件上传,附上github地址1。开始第一步,自然是安装模块,不多说了npminstallmulter--save这里简单介绍一下,因为文件上传使用的是post方式提交数据,所以上传的单个文件或者多个文件都会作为body添加到请求对象中,我们可以通过req.file或者req.files查看上传文件的相关信息。以单个文件上传为例,req.file返回一个对象:{"fieldname":"avatar",#前端上传文件名input"originalname":"wx.php",#本地文件名"encoding":"7bit",#文件编码类型"mimetype":"text/php",#文件类型"destination":"uploads/",#上传根目录"filename":"1497286037422Wx.php",#上传文件name"path":"uploads/1497286037422Wx.php",#filepath"size":18174#filesize}这个对象的key值是固定的,根据配置生成velue值,用于实现相关逻辑2.实现分两部分,前端前端和后台前端是常见的写法,form表单提交记住,enctype="multipart/form-data"属性必须加,否则后台收不到文件。后端首先,我们新建一个配置文件upload.js//upload.jsvarmulter=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.jsvarexpress=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为前端的name值上传文件的基本方法就是这个,当然还有很多配置参数等设置,参考GitHub说明,地址在开头。需要的可以参考杨成功的这篇文章。更多原创内容,请前往杨成功的全栈之路专栏