FormData()只发送对象类型的多文件


Multi files sent by FormData() only object type

我正在尝试使用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);
});
// The Javascript
var fileInput = document.getElementById('the-file');
var file = fileInput.files[0];
var formData = new FormData();
formData.append('file', file);

请尝试这个