-
Notifications
You must be signed in to change notification settings - Fork 0
Open
Description
通过js创建表单
<input type="file" name="myfile" id="myfile" mutiple/>const formData = new FormData()
formData.enctype='multipart/form-data'
const files = document.getElementById('src').files
const fileArray=[].slice.call(files,0) //类数组转换为数组
fileArray.forEach(file => {
formData.append('src',file) //循环遍历把文件对象插到formData对象上
})form.enctype = 'multipart/form-data'最早的HTTP协议中是不支持文件上传的,
在1995年制定的rfc1867规范中,在HTTP POST请求的内容类型Content-Type中扩展了multipart/form-data类型,
该类型用于向服务器发送二进制数据,以便支持文件的上传在使用form提交表单数据时,默认的编码格式为application/x-www-form-urlencoded
上传文件时需要通过enctype属性将编码方式设置为multipart/form-data
form.parse(ctx.req, function (err, fields, files) {
// fields 是普通表单数据
// files 是文件数据
})通过form.on语句将所有上传的文件加入到files里
const files = []
form.on('file', function (filed, file) {
files.push([filed, file])
})项目中的代码例子
const pro = new Promise(async (resolve, reject) => {
const form = new formidable.IncomingForm()
form.encoding = 'utf-8' // 设置传入表单字段的编码
form.maxFieldsSize = 1 * 1024 * 1024 // 上传文件大小限制为最大1M
form.enctype = 'multipart/form-data'
form.uploadDir = TMP_PATH // 文件保存在系统临时目录
form.keepExtensions = true // 使用文件的原扩展名
form.multiples = true // 设置为多文件上传模式
form.parse(ctx.req, async (error, fields, files) => {
if (error) {
reject(error)
}
const options = {
url: '/api/v1/xxxx',
method: 'POST',
formData: _.merge({
dest: 'upload',
tenantId,
userId,
}, fields),
json: true,
}
// 参数说明 src是按照fileName的顺序一一对应的
if (files.src) {
const fileName = []
options.formData.src = []
files.src.forEach(item => {
fileName.push(item.name)
options.formData.src.push(fs.createReadStream(item.path))
})
options.formData.fileName = JSON.stringify(fileName)
}
try {
const rs = await rp(options)
resolve(rs)
} catch (e) {
reject(e)
}
})
})参考链接