Для загрузки на Amazon S3 необходимо сохранить указанный c порядок в данных вашей формы. Например, в настоящее время у меня есть нечто, похожее на это:
var formData = new FormData();
formData.append('acl', 'acl here');
formData.append('key', 'key here');
formData.append('file', "file goes here e.g. $('#fileUpload')[0].files[0]");
А затем типичный вызов ajax.
Есть ли альтернатива FormData, которая определенно сохранит порядок свойства? В этом случае «acl» должен быть первым, «ключ» вторым, «файл» последним.
В поисках альтернативы, потому что согласно caniuse.com, 8% глобального трафика c не поддерживает FormData.
Единственный альтернативный способ, который я могу придумать, - это иметь форму HTML, заполнять поля динамически с помощью JavaScript (они не известны при загрузке страницы), а затем отправлять форму через jQuery ajaxSubmit формы (для получения процента прогресса). Я хотел бы избежать необходимости иметь форму HTML и использовать форму jQuery.
Весь код:
// TODO: Find alternative to FormData, keeping a 100% JS-solution (only library: jQuery)
var formData = new FormData();
formData.append('acl','acl');
formData.append('key', 'key');
formData.append('file', $('#fileUpload')[0].files[0]);
$.ajax({
url: 'https://MyLittleBucket.s3-accelerate.amazonaws.com',
type: 'post',
data: formData,
enctype: 'multipart/form-data',
contentType: false,
processData: false,
xhr: function() {
var xhr = $.ajaxSettings.xhr();
xhr.upload.onprogress = function (e) {
if (e.lengthComputable) {
var percentComplete = e.loaded / e.total * 100;
console.log(percentComplete);
}
};
return xhr;
},
success: function() {
console.log('File uploaded');
},
error: function() {
console.log('Upload error');
}
});
Примечание. HTML и я ищу событие "change" в JS, а затем продолжаю загрузку выше.