axios+node不使用form表单怎么同时提交文件和复杂参数

现在客户端和API层通信使用axios,客户端使用vue写的,数据在el-form里面(试了试,没法使用enctype?)所以在axios的头部设置了multipart/form-data,酱紫的
clipboard.png

API层接受的头部显示正常。

clipboard.png

问题在于现在multipart编码方式我们有特殊处理在fileUtil.js文件使用busboy解析对数据格式在包装一下。现在客户端发送过来的请求不会触发 以下事件

busboy.on('file', function(fieldname, file, filename, encoding, mimetype) {
  console.log('File [' + fieldname + ']: filename: ' + filename + ', encoding: ' + encoding + ', mimetype: ' + mimetype);
  file.on('data', function(data) {
    console.log('File [' + fieldname + '] got ' + data.length + ' bytes');
  });
  file.on('end', function() {
    console.log('File [' + fieldname + '] Finished');
  });
});
busboy.on('field', function(fieldname, val, fieldnameTruncated, valTruncated, encoding, mimetype) {
  console.log('Field [' + fieldname + ']: value: ' + inspect(val));
});

但是用postman模拟发送请求的话是可以正常解析的,并且我试过用FormData把数据一个个append进去也可以触发解析事件。但是用FormData遇到问题,像这样的复杂数据user: [{name: 'hangmeimei', age: '16'},{name: 'lilei', age: '16'}]会被编码成[object Object]这样子的字符串

问题就是客户端设置头部传参不会触发API层的解析事件,用FormData一些字段没法被正确编码,还有一点不明白就是为什么头部设置之后不会触发,明明头部显示的是form-data编码方式,且长度也是正常的

阅读 2.8k
1 个回答
新手上路,请多包涵

一时脑抽,转牛角尖了。对象一类的参数直接转为JSON,后台再去还原。还有一点提到设置了头部,请求显示也正常,busboy解析事件没有被触发是因为设置了头部只是告对方我的编码方式,参数格式并没有被自己编译,需要自己用H5的FormData的append方法将参数放进去,这时不用特意设置头部,会自动检查编码方式设置相应的头部也就是multipart/form-data。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题