首页 > 编程语言 >node.js文件上传(图片等等...)——利用connect-multiparty中间件

node.js文件上传(图片等等...)——利用connect-multiparty中间件

时间:2024-08-13 19:55:09浏览次数:16  
标签:node ... name 文件 req 中间件 jpg path 上传

一.概念步骤讲解

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

相关文章

  • 【算法】求1+2+3+...+n
    1.概述地址:JZ64求1+2+3+…+n描述求1+2+3+…+n,要求不能使用乘除法、for、while、if、else、switch、case等关键字及条件判断语句(A?B:C)。数据范围:0<n≤2000<n\le2000<n......
  • node npm nvm的恩怨情仇
    nvmnvminstall18.19.1nvmuse18.19.1node-vQ程序“node.exe”无法运行:指定的可执行文件不是此操作系统平台的有效应用程序。https://www.cnblogs.com/rnny/p/17839190.html注意比对nvm文件夹内的setting.txt文件内容rootnvm文件夹(path中的NVM_HOME)pathn......
  • Thinkphp8 通过中间件 和 属性 简单实现AOP
    转载请著名来源,侵权必究//属性接口declare(strict_types=1);namespaceapp\common\attribute;interfaceAttributeHandler{publicfunctionhandler(mixed$handler);}//不需要登陆属性declare(strict_types=1);namespaceapp\common\attribute;/***跳......
  • 3 node操作数据库
    传统和orm型的方式操作数据库的区别 传统的方式        mysql2库用来连接mysql和编写sql语句编写不方便也会有sql注入的风险 orm的方式Knex是一个基于JavaScript的查询生成器,它允许你使用JavaScript代码来生成和执行SQL查询语句。它提供了一种简单和直观的方......
  • 使用nvm切换Node.js版本
    一、安装nvmnvm(NodeVersionManager)是一个用于管理Node.js版本的工具,它允许你在同一台机器上安装和切换多个Node.js版本。1.安装nvm    https://github.com/coreybutler/nvm-windows  访问以上链接到github去下载 点击releases         下载......
  • MySQL常用命令增删改查select,update,alter...
    MySQL常用命令增删改查select,update,alter…文章目录MySQL常用命令增删改查select,update,alter...MySQL修改用户密码MySQL删除用户命令MySQL修改用户密码查看MySQL的用户及hostselectuser,hostfrommysql.user;备注host分别代表的连接方式user@‘localh......
  • Ubuntu22 安装和恢复 Hexo,解决nodejs默认版本较低的问题。
    因为Ubuntu自带的nodejs版本和我之前搭建好的hexo环境不符合,从github上面拉取之后不能够直接使用hexo配置,要重新下载和配置nodejs的版本。安装nvm安装步骤sudoaptinstallcurlcurlhttps://raw.githubusercontent.com/creationix/nvm/master/install.sh|bash出现问题......
  • 深入解析Node.js中的fs.watch:options与listener详解
    在Node.js中,fs.watch方法是一个功能强大的文件系统监控工具,它允许我们对文件或目录进行实时监控,并在文件或目录发生变化时触发相应的操作。在使用fs.watch时,两个关键的部分是options对象和listener回调函数。本文将详细讲解这两个部分,帮助读者更好地理解和使用fs.watch。一......
  • node.js 学习
    今天为大家推荐一款VSCode的插件FittenCode,FittenCode是由非十大模型驱动的AI编程助手,它可以自动生成代码,提升开发效率,帮您调试Bug,节省您的时间,另外还可以对话聊天,解决您编程碰到的问题。https://www.runoob.com/nodejs/fitten-code-nodejs.html#post-25998-10更改node......
  • 使用nvm管理多个版本的nodejs
    背景:项目依赖某个版本的nodejs,而我本地需要用最新版,那么就存在多个版本nodejs要使用了,如何方便的进行管理呢?使用nvm!下载地址:https://github.com/coreybutler/nvm-windows/releases 选择适合自己的安装程序即可,我用的Windows64位电脑,所以下载的nvm-setup.exe......