Question

我正在努力处理如何处理通过ajax发送到控制器的多个图像并将它们存储起来。我已经读过我应该创建新的 FormData对象，然后我就这样做了。

让我们来看看我的代码：

HTML：

<form enctype="multipart/form-data" id="formularz">
          <label class="btn btn-sm btn-success" for="files">
            <input id="files" type="file" name="zdjęcie[]" multiple style="display:none;" onchange="$('#upload-file-info').html($(this).val());">
            <i class="fa fa-plus-circle" aria-hidden="true"></i> Dodaj zdjęcia
            <input type="hidden" name="_token" value="{{Session::token()}}">
          </label>
          <label class="btn btn-sm btn-danger deleteImages">
            <i class="fa fa-times-circle" aria-hidden="true"></i> Wyczyść
          </label>
          <br>
          <div class="chosenImages">
            <output id="list"></output>
          </div>
</form>

JS：

var formData = new FormData($('#formularz')[0]);

      $.ajax({
        method:"POST",
        url:postAddNews,
        data: {
          formData:formData,
          _token:token
        },
        cache:false,
        contentType: false,
        processData: false,
        success:function(data){
            console.log("success");
            console.log(data);
        },
        error: function(data){
            console.log("error");
            console.log(data);
        }
     });

在服务器端，我会这样做（不通过ajax发送）：

$files = $request->file('zdjęcie');

$i = 1;
$filename = array();

foreach($files as $file) {
        Storage::disk('local')->put('newsimages/'.$i.'.'.$file->extension(), file_get_contents($file));
        $i++;
}

当我检查formData对象时，我只能看到：

Answer 1

首先你需要改变：

var formData = new FormData($('#formularz')[0]);

通过上面的代码，您只向formdata添加了一个文件，但multiple属性也在那里。所以你必须在formdata中附加所有文件，如：

var frmData = new FormData();
$.each($('#formularz_images')[0].files, function(i, file) {
    frmData.append('formularz[]', file);
});

你可以在控制器中得到它们：

$data  = Input::all();

这里$ data包含formularz索引，其中包含其中的所有图像。使用foreach()获取单个图片，如：

foreach($data['formularz'] as $image)
{

}

如何在PHP服务器端处理多个文件的javascript formdata？

1 个答案: