使用 Laravel 的多个图像上传 Dropzone 返回 null

Question

这是我的表格和 JavaScript 代码。 当我点击提交按钮时，email 字段有值，但文件字段没有值。 请帮忙！

<form action="{{ route('projects.store') }}" class="dropzone" method="post">

  {{ csrf_field() }}
  <div class="form-group {{ $errors->has('email') ? 'has-error': '' }}">
    <input type="text" name="email" placeholder="Enter email" class="form-control"><br>
    @if($errors->has('email'))
      <span class="help-block">
        {{ $errors->first('email') }}
      </span>
    @endif
  </div>

  <div class="fallback">
    <input name="file" type="file" multiple />
  </div>

  <input type="submit" name="" class="btn btn-danger" value="Submit" id="uploadfiles">
</form>

<script type="text/javascript">

  Dropzone.autoDiscover = false;

  var myDropzone = new Dropzone(".dropzone", 
  { 
    autoProcessQueue: false,
    parallelUploads: 10 // Number of files process at a time (default 2)
  });

  $('#uploadfiles').click(function()
  {
    myDropzone.processQueue();
 });
</script>

这是我的表格和 JavaScript 代码。 当我点击提交按钮时，email 字段有值，但文件字段没有值。 请帮助..这是我的 controller 方法

public function store(Request $request)
    {
        $this->validate($request, [
            'email' => 'required',
        ]);

        $email = $request->email;
        $file = $request->file('file');
        if($request->hasFile('file'))
        {
            dd('exist');
        }
        else
        {
            dd('no file');
        }

        exit();

        foreach($request->file('file') as $file)
        {
            $file_name = $file->getClientOriginalName();
            $file->move('/uploads', $file_name);
            dd('uploaded');
        }
    }

Answer 1

您必须在表单标签中添加enctype="multipart/form-data"才能上传文件。

此外，要在 controller 中获取多个文件，您必须像这样将文件名更改为file[] 。

<input name="file[]" type="file" multiple />

Answer 2

当我尝试从 vue 上传时遇到了类似的问题。 我通过在客户端将文件作为file[]附加到 formdata 来解决这个问题：

//var files is the actual input containing array of images uploaded
for (let i=0; i<files.length;i++){
  formdata.append('file[]', files[i]);
}

this.$axios.post(`api/files`, formdata, {
  headers: { "Content-type": "multipart/form-data"},
}).then((response) => {});

然后在服务器端遵循这个：

if ($files=$request->file('file')){
  foreach($files as $f){
    $path = $f->store('FileStorage', ['disk' => 'public']);
  }
// return 'success';
}