Задайте заголовок длины контента на отдельных частях многостраничной/формы-загрузки данных

Я хотел бы загрузить несколько файлов, используя запрос на отправку типа multipart/form-data, и для каждого файла мне нужно знать размер файла (длина содержимого) на стороне сервера.

Чтобы построить запрос POST в javascript, я использую объект FormData и добавляю объекты File для его загрузки. Это отлично работает, но только заголовок Content-type добавляется к каждой части в дополнение к заголовку Content-Disposition, но не Content-length, хотя эта информация доступна из отдельных объектов File.

Есть ли способ достичь того, что заголовки Content-length устанавливаются для каждой части из объекта FormData при отправке запроса?

Ниже приведен код, который я использую, включая проблему с работой. Он действительно использует 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(.....

Ответы

Ответ 1

Я не верю, что есть способ добавить пользовательский заголовок для каждого элемента данных формы. Однако почему бы вам не добавить его в заголовок размещения контента как часть имени файла:

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--