带有Laravel的多图像上传Dropzone返回null

时间:2019-10-23 14:31:29

标签: php laravel dropzone

这是我的表单和JavaScript代码。当我点击“提交”按钮时,“电子邮件”字段具有一个值,但是“文件”字段没有一个值。请帮忙!

<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代码。当我点击“提交”按钮时,“电子邮件”字段具有一个值,但是“文件”字段没有一个值。请帮忙!这是我的控制器方法

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');
        }
    }

2 个答案:

答案 0 :(得分:2)

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

还要在控制器中获取多个文件,您还必须像这样将文件名更改为file[]

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

答案 1 :(得分:0)

当我尝试从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';
}