如何上傳文件夾中的所有圖片

Question

嘗試從文件夾上傳所有圖像
服務器端的目標文件夾是test
圖像的目標格式是uniqid().jpg

問題 - 服務器端的結果數組似乎是空的

<input type='file' class='inpfile' id='inpfo' webkitdirectory='' directory='' multiple='true'>  

var inpfo = $('#inpfo');

inpfo.on('change', function(){
    var flist = inpfo[0].files;
    var fd = new FormData();
    fd.append('flist', flist);
    $.ajax({
    url: 'upload.php',
    type: 'POST',
    data: fd,
    async: false,
    contentType: 'multipart/form-data',
    success: function (data){
      console.log(data);  // Undefined array key "flist"
    },
    cache: false,
    contentType: false,
    processData: false
  });
});

上傳.php

$arr = $_FILES['flist'];  //seems this is an empty array
foreach($arr as $el){
    $tempname = $el['tmp_name'];
    $uniq = uniqid();
    $img = imagecreatefromjpeg($tempname);
    $targ = 'test/' . $uniq . '.jpg';
    imagejpeg($img, $targ);
}

Answer 1

您正在傳遞一個不正確的 FileList 對象fd.append您必須遍歷列表並單獨添加每個文件。

inpfo.on('change', function(){
    var flist = inpfo[0].files;
    var fd = new FormData();
    for (let i = 0; i < flist.length; i++){ 
        fd.append('flist[]', flist[i]); // add [] to denote array
    }
    $.ajax({
    url: 'upload.php',
    type: 'POST',
    data: fd,
    async: false,
    success: function (data){
      console.log(data);  // Undefined array key "flist"
    },
    cache: false,
    contentType: false,
    processData: false
  });
});

您使用的文件數組不正確，請參見here

$arr = $_FILES['flist'];   
foreach($arr['tmp_name'] as $tempname){
    $uniq = uniqid();
    $img = imagecreatefromjpeg($tempname);
    $targ = 'test/' . $uniq . '.jpg';
    imagejpeg($img, $targ);
}