javascript - 仅由 FormData() 发送的多个文件对象类型

Question

我尝试使用 FormData() 发送多张照片，通过提交保存在服务器上。但我只从服务器脚本中获得了对象。 我如何将照片名称、照片 tmp 和大小等详细信息发送到服务器脚本或 如何从服务器脚本读取此目标文件？

这是我的代码

<div class="container">
    <form action="" method="POST" enctype="multipart/form-data" id="fileinfo">
        <input type="file" name="images[]" id="images"  multiple />
        <hr>
        <div id="image-to-upload">

        </div>
        <input type="submit" />
     </form>
</div>

脚本

var fileCollection = new Array();
$("#images").on('change', function(e) {
    var files = e.target.files;
    $.each(files, function(i, file) {
        fileCollection.push(file);
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function(e) {
            var template = '<div>' + '<img src="' + e.target.result + '">' + '<input type="text" name="title" >' + '<button class="btn btn-sm btn-info upload">upload</button>' + '<a href="#" class="btn btn-sm btn-danger remove">Remove</a>' + '</div><br />';
            $("#image-to-upload").append(template);
        }
    });
});
$('form').on('submit', function(e) {
    e.preventDefault();
    var formdata = new FormData();
    formdata.append('image', fileCollection);
    var request = new XMLHttpRequest();
    request.open('post', 'photo', true);
    request.send(formdata);
});

Answer 1

// The Javascript
var fileInput = document.getElementById('the-file');
var file = fileInput.files[0];
var formData = new FormData();
formData.append('file', file);

请尝试一下