一.概念步骤讲解
1.安装和引入中间件
安装:通过npm安装connect-multiparty:
npm install connect-multiparty --save。
引入:在项目中引入connect-multiparty:
var multipart = require('connect-multiparty');
2.基本设置
配置上传目录:指定上传文件的临时存储位置,例如:
app.use(multiparty({
uploadDir: './temp'
}))
配置选项:支持传递选项给multiparty,例如限制文件大小、类型等:
multipart({
maxFilesSize: 1024 * 1024
})
3.路由应用
上传单个文件:使用multipartMiddleware来处理含有文件上传字段的POST请求:
app.post('/upload', multipartMiddleware, function(req, res) {
/* 文件处理逻辑 */
});
访问上传的文件:文件信息存储在req.files中,可以对其进行进一步处理。
4.文件处理
读取文件内容:可以使用Node.js的文件系统模块(fs)来读取和保存文件:
fs.readFile(req.files[0].path, function(err, data) {
/* 处理文件内容 */
});
移动重命名文件:可以将临时文件转移到永久存储位置:
fs.rename(uploadedPath, dstPath, function(err) {
/* 错误处理 */
});
5.安全和优化
删除临时文件:在文件处理完毕后,应删除临时文件以避免浪费磁盘空间:
fs.unlinkSync(req.files[0].path);
验证文件类型:可以在multipart()配置中指定允许的文件类型,以增强安全性:
multipart({fileFilter: ['image/png', 'image/jpg']})。
二.结合实例讲解
1.路由应用中单张图片上传
(1)请求内容
(2)代码处理
首先,安装和引入中间件connect-multiparty
接着,就可以对上传文件的路由进行操作
// 上传图片--路由
// 定义路由处理文件上传请求
router.post('/upload', multipart(), function(req, res) {
// 获取上传的文件信息
console.log("aaaa",req.files)
//输出的内容方便理解,以及方便后期处理数据
//req.files = {
// picture: [
// {
// fieldName: 'picture',
// originalFilename: 'qq_pic_merged_1709551386063.jpg',
// path: 'public\\uploads\\sBYh8VnoAIYKrcc62CYLNorX.jpg',
// headers: [Object],
// size: 42859,
// name: 'qq_pic_merged_1709551386063.jpg',
// type: 'image/jpeg'
// },
// {
// fieldName: 'picture',
// originalFilename: '微信.jpg',
// path: 'public\\uploads\\c7ZaR999uw2q40c4pj2FqaCP.jpg',
// headers: [Object],
// size: 45267,
// name: '微信.jpg',
// type: 'image/jpeg'
// }
// ]
// }
//元素originalFilename是上传的文件名字
//元素path是上传后自己变的名字
let one_f = req.files.picture;
var originalFilename = one_f.originalFilename;
var file_path = one_f.path;
// 读取文件内容并保存到新位置
if(file_path){
let date = new Date();
//上传的图片的裸名
let new_name = date.getTime() + path.extname(originalFilename);
//对新路径进行拼接处理
let new_file_name = 'public/uploads/'+new_name;
console.log(new_file_name)
//例子说明:new_file_name : public/uploads/1723549601566.jpg,
//运用fs中间件中的rename()方法对文件进行重命名
fs.rename(file_path, new_file_name, function(err) {
if (err) {
console.log(err)
//返后给前端的数据
res.json({status:-1,msg:err.message});
} else {
//返后给前端的数据
res.json({ msg: "文件上传完成", code: 0, data: {
fileName:new_file_name,
ext:path.extname(new_file_name)
}})
// res.status(200).send('File uploaded successfully');
}
});
}
});
2.路由应用中多张图片上传
此原理与上面的类似
(1)请求内容
(2)代码处理
首先,安装和引入中间件connect-multiparty
接着,就可以对上传文件的路由进行操作
// 上传图片--路由
// 定义路由处理文件上传请求
router.post('/uploadPics', multipart(), function(req, res) {
// 获取上传的文件信息
console.log("aaaa",req.files)
//多图,返回文件数组
//输出的内容方便理解,以及方便后期处理数据:
// req.files = {
// picture: [
// {
// fieldName: 'picture',
// originalFilename: 'qq_pic_merged_1709551386063.jpg',
// path: 'public\\uploads\\sBYh8VnoAIYKrcc62CYLNorX.jpg',
// headers: [Object],
// size: 42859,
// name: 'qq_pic_merged_1709551386063.jpg',
// type: 'image/jpeg'
// },
// {
// fieldName: 'picture',
// originalFilename: '微信.jpg',
// path: 'public\\uploads\\c7ZaR999uw2q40c4pj2FqaCP.jpg',
// headers: [Object],
// size: 45267,
// name: '微信.jpg',
// type: 'image/jpeg'
// }
// ]
// }
//元素originalFilename是上传的文件名字
//元素path是上传后自己变的名字
let one_f = req.files.picture;
console.log('33333',one_f)
//此数组用来存放path--上传后自己变的名字
var arr = [];
//此数组用来存放拼接后的文件名字
var arr_base = []
for(let i=0;i<one_f.length;i++){
arr.push(one_f[i].path)
console.log( '3333',path.parse(arr[i]))
arr_base.push('public/uploads/'+path.parse(arr[i]).base)
}
//将拼接好的文件名字返回给前端
res.json({ msg: "文件上传完成", code: 0, data: {pics:arr_base}})
});
标签:node,...,name,文件,req,中间件,jpg,path,上传
From: https://blog.csdn.net/x15514104477/article/details/141171727