使用模块:multer
npm i multer
使用
var multer = require('multer')
// 指定上传的文件路径 //这里是当前文件平级的public/images
var upload = multer({
dest: path.join(__dirname, 'public', 'images') });
单文件接收: req.file对象接受文件或者图片对象
multer(options).single(myfiles)
传单个文件内容,如一次只上传一张图片。myfiles为上传时文件的字段名称。
options 是multer的属性 {dest:xxxx}
前端代码:
let fora1 = new FormData()
fora1.append('files', this.state.form.file)
axios.post('user/postPto', fora1, {
headers: {
"Content-Type": "multipart/form-data "
}
}).then(res => {
console.log(res, 'res');
let {
data } = res.data.data
alert(data)
})
简略
//提交单个文件 formdata 里面字段是myfiles的对象
router.post('/postPto', upload.single('myfiles'), (req, res) => {
console.log("=========================================");
console.log("=========================================");
let fileObj = req.file;
console.log('fileObj.myfiles', fileObj);
res.send(endMassage({
data: "信息插入成功", fileObj }))
})
详细
//提交用户照片 single 与前端form'da'ta中的字段名相匹配才行 只能是单个文件上传使用
router.post('/postPto', upload.single('files'), (req, res) => {
console.log("=========================================");
var fileObj = req.file;
console.log('fileObj', fileObj);
let imgUrl = fileObj.filename + '.'+ fileObj.originalname.split('.')[1]
// fileObj {
// fieldname: 'files',
// originalname: 'WIN_20210318_08_34_14_Pro.jpg',
// encoding: '7bit',
// mimetype: 'image/jpeg',
// destination: 'E:\\uxiao.zjqfyy.shop\\myExpressDome\\myExpressDome\\routes\\indexR\\public\\image',
// filename: '5f21c2b4328eff34204d439741ebd957',
// path: 'E:\\uxiao.zjqfyy.shop\\myExpressDome\\myExpressDome\\routes\\indexR\\public\\image\\5f21c2b4328eff34204d439741ebd957',
// size: 124092
// }
//读取文件内容
// var content = fileObj['files'][0].buffer.toString();
// fs.
// console.log(content, "content");
// let fileUrl = '/imges' + file['file'][0].originalname
res.send(endMassage({
data: "信息插入成功", imgUrl}))
})
多文件接收: req.files 是传来的文件数组
multer(options).array(fieldname[,maxCount])
//一次最多上传3个文件
let upload=multer({
dest:"public/images"}).array("myfiles",3);
适用于同一个字段,一次上传多个文件的情况,例如发状态时,选择多张图片发送。接受一个以 fieldname 命名的文件数组。可以指定maxCount 来限制上传的最大数量。这些文件的信息保存在 req.files。我下面的例子是使用的myfiles字段,最大接受文件数量10.
前端代码:
let fora1 = new FormData()
fora1.append('myfiles', file)
fora1.append('myfiles', file)
fora1.append('myfiles', file)
axios.post('user/postPtoList', fora1, {
headers: {
"Content-Type": "multipart/form-data "
}
}).then(res => {
console.log(res, 'res');
let {
data } = res.data.data
alert(data)
})
var fs = require('fs')
var multer = require('multer')
//设置保存的路径 dest
var upload = multer({
dest:"public/images" })
//提交用户多个照片 formdata 里面字段是myfiles的数组
router.post('/postPto', upload.array('myfiles', 10), (req, res) => {
console.log("=========================================");
console.log("=========================================");
let fileObj = req.files;
console.log('fileObj', fileObj);
let urlList = fileObj.map(i => {
let oldname = i.path //获取path: 'public\\upload\\0f625978d5d1a783b12e149718f8b634',
let newname = i.path + i.originalname //.jpg
fs.renameSync(oldname, newname)//将老的文件名改成新的有后缀的文件 #同步写法
return i.originalname
})
res.send(endMassage({
data: "信息插入成功", urlList }))
})
使用fs模块将上传的文件重命名。
接受多文件,有不同name标识的 req.files 是传来的文件数组
multer(options).fields(fields)
适用于上传多个字段的情况。接受指定 fields 的混合文件。这些文件的信息保存在 req.files。fields 是一个对象数组,具有 name 和可选的 maxCount 属性。
let fieldsList=[
{
name:"myfiles1"},
{
name:"myfiles2",maxCount:2}
]
let upload=multer({
dest:"public/images"}).fields(fieldsList);
接收任意类型的文件,接收一切上传的文件。
let upload=multer({
dest:"public/images"}).any();
本文只是介绍了常用的几个方法,包括单文件,多文件同name,多文件不同name,任意文件,
学习参考了这位老师的博文:
https://blog.csdn.net/Charissa2017/article/details/105207422