技术标签: multipart/form-data Node 文件上传 multer
multer是node.js的一个中间件,主要是用于处理multipart/form-data类型的表单数据,而且multer不会处理任何非multipart/form-data类型的请求。在使用express框架,进行网络请求时,传输的数据类型可能会是multipart/form-data,为了解析获取数据,需要使用中间件multer,而且multer组件只会解析content-type为multipart/form-data,这中数据请求,一般会分为两种,一种时普通的数据请求,不存在附件传输,第二种,就是存在附件上传。
在使用multer中间件时,需要使用npm 进行安装,cd 到项目目录下,使用命令行 npm install multer --save
首先提交表单数据,可以使用HTML中的form表单的形式,下面是前端展示页面:
<html>
<head>
</head>
<body>
<h3>单张图上传</h3>
<form action="/singlePicture/Upload" method="post" enctype="multipart/form-data">
<h2>单图上传</h2>
<input type="file" name="logo">
<input type="submit" value="提交">
</form>
<h3>多张图片上传</h3>
<form action="/uploadFile/double" method="post" enctype="multipart/form-data">
<input type="file" name="logo" multiple>
<input type="submit" value="提交">
</form>
<h3>多张图的上传上传 同时传力多个控件上传</h3>
<form action="/uploadFile/FieldsImg" method="post" enctype="multipart/form-data">
<input type="file" name="logo" value='' multiple>
<input type="file" name="text" value='' multiple>
<input type="submit" value="提交">
</form>
<h3>文件上传 any接收方式</h3>
<form action="/upLoad/Any" method="post" enctype="multipart/form-data">
<input type="file" name="logo" value='' multiple>
<input type="file" name="text" value='' multiple>
<input type="submit" value="提交">
</form>
<body>
</html>
在上传时需要后端的支持
var express = require('express');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var multer = require('multer');
var path = require('path');
var underscore = require('underscore');
var fs = require('fs');
var app = express();
//使用cookie-parser
//app.use(cookieParser());
//post 请求参数解析
//app.use(bodyParser.json());//JSON格式的解析
//app.use(bodyParser.raw());// buffer处理
//app.use(bodyParser.text());// 字符串处理
//app.use(bodyParser.urlencoded(
//{
// extended: true,
// limit: 2*1024*1024, //限制-2M
// type:'application/x-www-form-urlencoded'
// }
// ));//urlencoded
//app.use(multer({dest:'./www/Imgs'}).any());//支持任何类型的传输 可以是单图 也可以是多图
//单图传输 在单图传输时,可以使用req.file获取单个的附件文件 1)multer处理之后的数据格式为Json字典格式 2)传输的附件个数不能超过一个 3)input元素的name属性必须要和single('标记')中的标记一样
/**
*
{
"fieldname": "logo",
"originalname": "11.jpg",
"encoding": "7bit",
"mimetype": "image/jpeg",
"destination": "./www/Imgs",
"filename": "c8bf8e4cee125d37f26212105816c39f",
"path": "www/Imgs/c8bf8e4cee125d37f26212105816c39f",
"size": 157606
}
*
**/
//app.use(multer({dest:'./www/Imgs'}).single('logo'));
//多图传输 最大的传输附件个数 传输的附件个数 前端只能传输小于等于 设置的附件个数 multer处理之后的数据样式为数组
/**
*[
{
"fieldname": "logo",
"originalname": "1307076-d6b4f8a17017dd28.png",
"encoding": "7bit",
"mimetype": "image/png",
"destination": "./www/Imgs",
"filename": "d3433e2e6eb4d0b196fcc74a3c7ad81c",
"path": "www/Imgs/d3433e2e6eb4d0b196fcc74a3c7ad81c",
"size": 152549
},
{
"fieldname": "logo",
"originalname": "1684607-34b296a3458bedc7.png",
"encoding": "7bit",
"mimetype": "image/png",
"destination": "./www/Imgs",
"filename": "49e099645355f26681a85fe5cbac0409",
"path": "www/Imgs/49e099645355f26681a85fe5cbac0409",
"size": 8637
}
]
*
*/
//app.use(multer({dest:'./www/Imgs'}).array('logo',2));
//多组类型的传输 maxCount 代表最大的传输附件的个数
/*
*
*[
[
{
"fieldname": "logo",
"originalname": "1684607-34b296a3458bedc7.png",
"encoding": "7bit",
"mimetype": "image/png",
"destination": "./www/Imgs",
"filename": "5f42e9c390e91b106d5f16f809f62885",
"path": "www/Imgs/5f42e9c390e91b106d5f16f809f62885",
"size": 8637
},
{
"fieldname": "logo",
"originalname": "1684607-fd11ea7d9b0fc3c5.png",
"encoding": "7bit",
"mimetype": "image/png",
"destination": "./www/Imgs",
"filename": "246fb195d84d056ce8f38d07ec806253",
"path": "www/Imgs/246fb195d84d056ce8f38d07ec806253",
"size": 72879
}
],
[
{
"fieldname": "text",
"originalname": "2019年绩效考核-4月-客户端.xlsx",
"encoding": "7bit",
"mimetype": "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
"destination": "./www/Imgs",
"filename": "7918d6272d166309a23c2240a4e9562f",
"path": "www/Imgs/7918d6272d166309a23c2240a4e9562f",
"size": 23502
},
{
"fieldname": "text",
"originalname": "testApp.html",
"encoding": "7bit",
"mimetype": "text/html",
"destination": "./www/Imgs",
"filename": "fe3d6edc83fea5f0fcbef349a7d1ce5f",
"path": "www/Imgs/fe3d6edc83fea5f0fcbef349a7d1ce5f",
"size": 4487
}
]
]
*
*/
app.use(multer({dest:'./www/Imgs'}).fields([{name:'logo', maxCount:2},{name:'text', maxCount:2}]));
// 不接受文件上传 只是一个普通的post请求 只不过传输的数据样式是 multipart/form-data
//app.use(multer().none());
//存储磁盘
/*
var storage = multer.diskStorage({
//文件保存的路径 这个必须要是 自己手动提前创建好的 不能动态的创建
destination: function (req, file, cb) {
//req 网络请求的对象 file 传输过来的文件
var userid = req.body.userid;
userid ='张辉';
var filepath = path.join(__dirname,'./www/Imgs');
if (!fs.existsSync(filepath)) {
fs.mkdirSync(filepath);
};
console.log('文件路径'+filepath);
cb(null,filepath)
},
filename: function (req, file, cb) {
//filename 是指定保存的文件的名字 req 网络请求的对象 file 传输过来的文件
console.log(file.originalname+'文件的原始的名字');
cb(null, file.fieldname + '-' + Date.now())
}
});
app.use(multer({storage:storage}).any());
*/
app.get('/testGetRequest',function(req,res){
//var expires = getDateAfter();
var expires = new Date('2019-05-20 14:45:00');
var SCNcookie = req.cookies.SCN;
console.log('SCN'+SCNcookie);
console.log(expires+'过期时间');
res.cookie('SCN','app',{maxAge:1000*3600*24*7,secure:false,path:'/'});
res.send('hello world');
console.log(req.cookie+'cookie内容');
console.log(req.body+'body请求内容');
res.end('clear cookie');
});
var server = app.listen(8081,function(){
var host = server.address().address;
var port = server.address().port;
console.log('IP地址'+host+'端口'+port);
console.log('启动成功');
});
//删除Cookie
app.get('/deleteCookie',function(req,res){
res.clearCookie('SCN');
res.end('clearCookie');
});
//post请求
app.post('/getPostRequest',function(req,res){
console.log(req.body+"请求体的内容");
console.log(JSON.stringify(req.body)+"解析成字符串");
console.log(req.body.scn+"请求体的内容SCN");
res.send({"code":'200','msg':"成功"});
res.end();
});
//单张的图片上传
app.post('/singlePicture/Upload',function(req,res){
var uploadFile = req.file;
console.log(JSON.stringify(uploadFile));
var fileName = uploadFile.path+path.parse(uploadFile.originalname);
fs.rename(uploadFile.path,fileName,function(err){
if (err) {
res.send({'code':'300'});
}else{
res.send(req.file);
};
res.end();
});
});
//多张图片上传
app.post('/uploadFile/double',function(req,res){
for(var i in req.files){
var originfile = req.files[i];
var newName = originfile.path+path.parse(originfile.originalname).ext;
fs.rename(originfile.path,newName,function(err){
if(err) {
res.send({"code":"300"});
res.end();
}else{
if (i==req.files.length-1) {
//res.send({"code":"200"});
res.send(req.files);
res.end();
};
};
});
}
});
//多张图片上传 多个filed支持
app.post('/uploadFile/FieldsImg',function(req,res){
var fileValues = underscore.values(req.files);
console.log(JSON.stringify(fileValues));
res.send(fileValues);
res.end();
});
//any
app.post('/upLoad/Any',function(req,res){
res.send(req.files);
res.end();
});
//post的post请求 format data
app.post('/normalFormData/Request',function(req,res){
res.send({'code':'200'});
res.end();
});
app.get('/form', function(req, res, next){
var form = fs.readFileSync('./formsingle.html', {encoding: 'utf8'});
res.send(form);
res.end();
});
//获取日期
function getDateAfter(){
return new Date(new Date().getTime()+1000*24*3600*7).Format('yyyy-MM-dd HH:mm');
}
在multer处理之后的数据格式中,对应的键值含义如下
{
"fieldname": "logo", ->标示的键值 即input标签元素 和multer.single('标示')约定的标示
"originalname": "11.jpg",->传输之前的图片名字
"encoding": "7bit", ->文件的编码类型
"mimetype": "image/jpeg",->文件的格式
"destination": "./www/Imgs", ->存储的资源路径
"filename": "c8bf8e4cee125d37f26212105816c39f",->存储的资源名字
"path": "www/Imgs/c8bf8e4cee125d37f26212105816c39f",->存储之后的附件路径
"size": 157606 ->附件的大小
}
遇见的坑记录:
1.最初使用的multer 版本 @0.1.8,而最新的版本 @1.4.1,在@0.1.8中如果使用无附件传输的multer,只需要使用app.use(multer());
无需做其他的操作,但是,在新版本中,就不行,你需要使用app.use(multer().none());否则,就会报错
express+multer抛出错误:'app.use() requires middleware functions'
解决办法:app.use(multer().none());
参考博客记录:https://segmentfault.com/q/1010000003050818
参考学习博客:
https://github.com/expressjs/multer
https://blog.csdn.net/chaoyangsun/article/details/79209522
https://www.cnblogs.com/lijinwen/p/7906828.html
https://segmentfault.com/a/1190000007412310
https://www.cnblogs.com/zaifeng0108/p/7225058.html
https://www.cnblogs.com/chyingp/p/express-multer-file-upload.html
https://blog.csdn.net/weixin_36094484/article/details/81415060
文章浏览阅读645次。这个肯定是末尾的IDAT了,因为IDAT必须要满了才会开始一下个IDAT,这个明显就是末尾的IDAT了。,对应下面的create_head()代码。,对应下面的create_tail()代码。不要考虑爆破,我已经试了一下,太多情况了。题目来源:UNCTF。_攻防世界困难模式攻略图文
文章浏览阅读2.9k次,点赞3次,收藏10次。偶尔会用到,记录、分享。1. 数据库导出1.1 切换到dmdba用户su - dmdba1.2 进入达梦数据库安装路径的bin目录,执行导库操作 导出语句:./dexp cwy_init/[email protected]:5236 file=cwy_init.dmp log=cwy_init_exp.log 注释: cwy_init/init_123..._达梦数据库导入导出
文章浏览阅读1.9k次。1. 在官网上下载KindEditor文件,可以删掉不需要要到的jsp,asp,asp.net和php文件夹。接着把文件夹放到项目文件目录下。2. 修改html文件,在页面引入js文件:<script type="text/javascript" src="./kindeditor/kindeditor-all.js"></script><script type="text/javascript" src="./kindeditor/lang/zh-CN.js"_kindeditor.js
文章浏览阅读2.3k次,点赞6次,收藏14次。SPI的详情简介不必赘述。假设我们通过SPI发送0xAA,我们的数据线就会变为10101010,通过修改不同的内容,即可修改SPI中0和1的持续时间。比如0xF0即为前半周期为高电平,后半周期为低电平的状态。在SPI的通信模式中,CPHA配置会影响该实验,下图展示了不同采样位置的SPI时序图[1]。CPOL = 0,CPHA = 1:CLK空闲状态 = 低电平,数据在下降沿采样,并在上升沿移出CPOL = 0,CPHA = 0:CLK空闲状态 = 低电平,数据在上升沿采样,并在下降沿移出。_stm32g431cbu6
文章浏览阅读1.2k次,点赞2次,收藏8次。数据链路层习题自测问题1.数据链路(即逻辑链路)与链路(即物理链路)有何区别?“电路接通了”与”数据链路接通了”的区别何在?2.数据链路层中的链路控制包括哪些功能?试讨论数据链路层做成可靠的链路层有哪些优点和缺点。3.网络适配器的作用是什么?网络适配器工作在哪一层?4.数据链路层的三个基本问题(帧定界、透明传输和差错检测)为什么都必须加以解决?5.如果在数据链路层不进行帧定界,会发生什么问题?6.PPP协议的主要特点是什么?为什么PPP不使用帧的编号?PPP适用于什么情况?为什么PPP协议不_接收方收到链路层数据后,使用crc检验后,余数为0,说明链路层的传输时可靠传输
文章浏览阅读587次。软件测试工程师移民加拿大 无证移民,未受过软件工程师的教育(第1部分) (Undocumented Immigrant With No Education to Software Engineer(Part 1))Before I start, I want you to please bear with me on the way I write, I have very little gen...
文章浏览阅读304次。Thinkpad X250笔记本电脑,装的是FreeBSD,进入BIOS修改虚拟化配置(其后可能是误设置了安全开机),保存退出后系统无法启动,显示:secure boot failed ,把自己惊出一身冷汗,因为这台笔记本刚好还没开始做备份.....根据错误提示,到bios里面去找相关配置,在Security里面找到了Secure Boot选项,发现果然被设置为Enabled,将其修改为Disabled ,再开机,终于正常启动了。_安装完系统提示secureboot failure
文章浏览阅读10w+次,点赞93次,收藏352次。1、用strtok函数进行字符串分割原型: char *strtok(char *str, const char *delim);功能:分解字符串为一组字符串。参数说明:str为要分解的字符串,delim为分隔符字符串。返回值:从str开头开始的一个个被分割的串。当没有被分割的串时则返回NULL。其它:strtok函数线程不安全,可以使用strtok_r替代。示例://借助strtok实现split#include <string.h>#include <stdio.h&_c++ 字符串分割
文章浏览阅读2.3k次。1 .高斯日记 大数学家高斯有个好习惯:无论如何都要记日记。他的日记有个与众不同的地方,他从不注明年月日,而是用一个整数代替,比如:4210后来人们知道,那个整数就是日期,它表示那一天是高斯出生后的第几天。这或许也是个好习惯,它时时刻刻提醒着主人:日子又过去一天,还有多少时光可以用于浪费呢?高斯出生于:1777年4月30日。在高斯发现的一个重要定理的日记_2013年第四届c a组蓝桥杯省赛真题解答
文章浏览阅读851次,点赞17次,收藏22次。摘要:本文利用供需算法对核极限学习机(KELM)进行优化,并用于分类。
文章浏览阅读1.1k次。一、系统弱密码登录1、在kali上执行命令行telnet 192.168.26.1292、Login和password都输入msfadmin3、登录成功,进入系统4、测试如下:二、MySQL弱密码登录:1、在kali上执行mysql –h 192.168.26.129 –u root2、登录成功,进入MySQL系统3、测试效果:三、PostgreSQL弱密码登录1、在Kali上执行psql -h 192.168.26.129 –U post..._metasploitable2怎么进入
文章浏览阅读257次。本文将为初学者提供Python学习的详细指南,从Python的历史、基础语法和数据类型到面向对象编程、模块和库的使用。通过本文,您将能够掌握Python编程的核心概念,为今后的编程学习和实践打下坚实基础。_python人工智能开发从入门到精通pdf