- 
                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)
    }
  })
})参考链接