javascript - Establezca el encabezado de longitud del contenido en partes individuales de una carga de datos de múltiples partes/formulario

angularjs multipartform-data

Question

Me gustaría cargar varios archivos utilizando una solicitud de publicación de tipo multipart/form-data y para cada archivo necesito saber el tamaño del archivo (contenido-longitud) en el lado del servidor.

Para construir la solicitud POST en javascript , uso un objeto FormData y añado los objetos File para cargarlos. Esto funciona bien, pero solo se agrega un encabezado de Content-type a cada parte, además del encabezado de Content-Disposition , pero no Content-length encabezado de Content-length , aunque esta información está disponible en los objetos individuales del archivo.

¿Hay alguna forma de lograr que los encabezados de Content-length se configuren para cada parte del objeto FormData al enviar la solicitud?

A continuación se muestra el código que utilizo, incluida mi solución al problema. En realidad usa angular-js para enviar la solicitud, pero creo que esto no es relevante para la pregunta.

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

No creo que haya una manera de agregar un encabezado personalizado para cada elemento de datos del formulario. Sin embargo, ¿por qué no lo agrega al encabezado de disposición de contenido, como parte del nombre del archivo?

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 );
}

No estoy seguro de cómo está manejando esto en el servidor, pero la solicitud se vería así:

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