在 multipart/form-data 上传的各个部分设置 content-length header

Question

我想使用 multipart/form-data 类型的 post 请求上传多个文件，对于每个文件，我需要知道服务器端的文件大小 (content-length)。

为了在 javascript 中构造 POST 请求，我使用了 FormData object 并附加了文件 object 以便上传到它。这工作正常，但除了 Content-Disposition header 之外，每个部分只添加了 Content-type header，但没有 Content-length header , 尽管可以从单个文件 objects.

中获得此信息

有没有办法实现在发送请求时FormDataobject的每个部分都设置Content-lengthheader？

下面是我使用的代码，包括我的work-around问题。它实际上使用 angular-js 发送请求，但我认为这与问题无关。

var form = new window.FormData();

form.append('additional-field-1', new Blob(['some plain text'], {type : 'text/plain'}));

for (var file in fileList) {
    var fileObj = fileList[file];
    var count = 1 + parseInt(file, null);
    form.append('file-size-' + count, new Blob([fileObj.size], {type : 'text/plain'}));
    form.append('file-' + count, fileObj);
}

$http.post(url, form, {
    transformRequest: angular.identity,
    headers: {'Content-Type': undefined}
}).success(.....

Answer 1

我认为没有办法为每个表单数据元素实际添加自定义 header。但是，为什么不将其作为文件名的一部分添加到内容配置 header 中：

data = new FormData();
data.append('additional-field-1', new Blob(['some plain text'], {type : 'text/plain'}));

for (var i = 0; i< $( '#file' )[0].files.length; i++) {
   var fileObj = $( '#file' )[0].files[i];
   data.append( '{ size : ' + fileObj.size + ' }' , $( '#file' [0].files[i], $( '#file' )[0].files[i].name );
}

我不确定你是如何在服务器上处理这个的，但请求看起来像这样：

------WebKitFormBoundarysZxMHYOzMkqDmOvR
Content-Disposition: form-data; name="additional-field-1"; filename="blob"
Content-Type: text/plain


------WebKitFormBoundarysZxMHYOzMkqDmOvR
Content-Disposition: form-data; name="{ size : 22984 }"; filename="MatrixArithmetic.vshost.exe"
Content-Type: application/x-msdownload


------WebKitFormBoundarysZxMHYOzMkqDmOvR
Content-Disposition: form-data; name="{ size : 187 }"; filename="MatrixArithmetic.vshost.exe.config"
Content-Type: application/xml


------WebKitFormBoundarysZxMHYOzMkqDmOvR--

在 multipart/form-data 上传的各个部分设置 content-length header

Set content-length header on individual parts of a multipart/form-data upload

javascript

angularjs

multipartform-data

multipart

form-data