Dropzone.js + Laravel - 多文件上传不起作用(仅适用于一个文件)

时间:2016-01-24 08:42:35

标签: javascript php jquery laravel dropzone.js

我想借助Dropzone.js插件使用AJAX上传多个文件。

我所做的是 -

HTML(查看) -

<div class="dropzone" id="add-slide-image">
</div>

JS -

Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("div#add-slide-image",
                    {
                        url: baseUrl+"/slide/uploadimage",
                        params: {
                            _token: csrfToken
                        },
                        maxFilesize: 3, // MB
                        maxFiles:40,                 //Trigers "maxfilesexceeded" event
                        acceptedFiles:'image/*',
                        method: "post",
                        addRemoveLinks: true,
                        paramName: "file",
                        uploadMultiple: true
                    });

控制器 -

public  function storeImageFromClientComputer(Request $request)
{
  //return $request->file('file');//Input::file('droped_images');
      $files = $request->file('file');
      $names = [];

      foreach ($files as $file)
      {
        $names = $file->getClientOriginalName();
      }
      return $names;
    /*//$files=$request->file('images');
    $file=$request->file('file');

    if($file)
    {
        $random_original_image_name=str_random(30).".".$file->getClientOriginalExtension();
        $file->move(public_path().'/uploads/userfiles/images/',Auth::id()."-".$random_original_image_name);
        $original_image_name=base_path()."/public/uploads/userfiles/images/".Auth::id()."-".$random_original_image_name;
        $thumb_image_name=base_path()."/public/uploads/userfiles/thumbs/".Auth::id()."-".$random_original_image_name;
        if(file_exists($original_image_name)){
            $thumb=Image::make($original_image_name)->resize(200,null,function($constraint){
                $constraint->aspectRatio();
            });
            $thumb->save($thumb_image_name);

            $id=UserSlidePhoto::insertGetId([
                'user_id'=>Auth::id(),
                'social_image_id'=>0,
                'original_image_name'=>Auth::id()."-".$random_original_image_name,
            'thumbnail_name'=>Auth::id()."-".$random_original_image_name
            ]);
            $image_info=UserSlidePhoto::find($id);
            return  response()->json($image_info,200);
        }
    }
  return  response()->json("ERROR",400);*/
}

此控制器仅用于测试是否收到所有文件。 我从这里只得到一个文件。 评论代码用于真实文件上传。

我总是只在循环中获得一个文件。

Dropzone的CDN是从here(CSS + JS)添加的。

有人可以帮忙吗?

提前感谢您的帮助:)

1 个答案:

答案 0 :(得分:0)

我已经解决了这个问题 -

<强> JS -

Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("div#add-slide-image",
                    {
                        url: baseUrl+"/slide/uploadimage",
                        params: {
                            _token: csrfToken
                        },
                        maxFilesize: 3, // MB
                        maxFiles:40,
                        parallelUploads: 10000,
                        acceptedFiles:'image/*',
                        method: "post",
                        addRemoveLinks: true,
                        paramName: "file",
                        uploadMultiple: true
                    });

控制器(PHP) -

public  function storeImageFromClientComputer(Request $request)
{
      $files = $request->file('file');
      $no_of_files = count($files);
      /*foreach ($files as $file)     //Don't know why this 'foreach' is not working
      {
        $file->getClientOriginalName();
      }*/
      if($no_of_files==0)
      {   //To check if any in-essential AJAX is called
        return "Valueless Calling !!!!!!";
      }
      for($i=0;$i<$no_of_files;$i++)
      {
        $file = $files[$i];//->getClientOriginalName();
        if($file)
        {
            $random_original_image_name=str_random(30).".".$file->getClientOriginalExtension();
            $file->move(public_path().'/uploads/userfiles/images/',Auth::id()."-".$random_original_image_name);
            $original_image_name=base_path()."/public/uploads/userfiles/images/".Auth::id()."-".$random_original_image_name;
            $thumb_image_name=base_path()."/public/uploads/userfiles/thumbs/".Auth::id()."-".$random_original_image_name;
            if(file_exists($original_image_name))
            {
                $thumb=Image::make($original_image_name)->resize(200,null,function($constraint){
                    $constraint->aspectRatio();
                });
                $thumb->save($thumb_image_name);

                $id=UserSlidePhoto::insertGetId(
                                                  [
                                                    'user_id'=>Auth::id(),
                                                    'social_image_id'=>0,
                                                    'original_image_name'=>Auth::id()."-".$random_original_image_name,
                                                    'thumbnail_name'=>Auth::id()."-".$random_original_image_name
                                                  ]
                                                );
                $image_info=UserSlidePhoto::find($id);
            }
        }
        else
            return  response()->json("ERROR",400);
      }
    return  "SUCCESS";
}