Dropzone.js多个图片上传无法正常工作

时间:2016-11-17 13:04:28

标签: laravel dropzone.js multiple-file-upload

Jquery的

Dropzone.options.sliderDropzone = {
autoProcessQueue: true,
parallelUploads: 1,
acceptedFiles : 'image/*',
paramName : "resim",
init: function () {
        this.on("complete", function (file) {
            if (this.getUploadingFiles().length === 0 && this.getQueuedFiles().length === 0) {
                setTimeout(function(){ location.reload(true); }, 2000);

            }



        })
    }
};

HTML

<form action="/upload" class="dropzone dropzone-file-area " id="sliderDropzone" method="POST" >

                {{ csrf_field() }}
                <div class="dz-default dz-message"><span><i class="icon-cloud-download" style="font-size:50px;display:block"></i><br/> Resmi sürükleyip bırakın veya buraya tıklayın.</span></div>


            </form>

服务器端Laravel

public function resim_upload(Request $request,$proje_id)
{


    if($resim = $request->file("resim"))
    {

            $time = time();
            $resim_isim = $time.".jpg";
            $resim_isim_thumb = "galeri_thumb_".$time.".jpg";
            $resim_isim_large = "galeri_large_".$time.".jpg";
            Image::make($resim->getRealPath())->fit(600,400)->save(public_path("uploads/".$resim_isim_thumb));
            Image::make($resim->getRealPath())->resize(null, 720, function ($constraint) {
                $constraint->aspectRatio();
            })->save(public_path("uploads/".$resim_isim_large));

            $input = [];
            $input["isim"] = $resim_isim;
            $input["imageable_id"] = $proje_id;
            $input["imageable_type"] ="App\Proje";

            $input["sira"] = 0;
            Resim::create($input);



        Session::flash("b_durum",0);
        Session::flash("bilgilendirme","Resim başarıyla yüklendi");




    }
}

上传多个文件时出现问题。例如,我想上传5个图像文件。在数据库端5添加了记录但是一些图像名称相同。当我控制上传文件夹3上传的图像但数据库上的图像记录是5.

上传文件夹中的图片名称是

galeri_large_1479329550.jpg
galeri_large_1479345567.jpg
galeri_large_1479374665.jpg

数据库记录

image name column 
---------------------------
galeri_large_1479329550.jpg
galeri_large_1479329550.jpg
galeri_large_1479345567.jpg
galeri_large_1479345567.jpg
galeri_large_1479374665.jpg

上传多个文件时有时没有问题但通常会出现此问题。所以我无法理解为什么会出现问题。

2 个答案:

答案 0 :(得分:0)

foreach ($request->file("resim") as $thumbsnail) {
                $thu = time().'.'.$thumbsnail->getClientOriginalExtension();
                Image::make($thumbsnail->getRealPath())->resize(600, 400, function ($constraint) {
                    $constraint->aspectRatio();
                })->save($destinationPath.'/'.$thu);

//Insert to the DB


            }
//Then return response

答案 1 :(得分:0)

我在库中找到了这段代码:

key: "_getParamName",
    value: function _getParamName(n) {
      if (typeof this.options.paramName === "function") {
        return this.options.paramName(n);
      } else {
        return "" + this.options.paramName + (this.options.uploadMultiple ? "[" + n + "]" : "");
      }
    }

并写道:

key: "_getParamName",
    value: function _getParamName(n) {
      if (typeof this.options.paramName === "function") {
        return this.options.paramName(n);
      } else {
        return "" + this.options.paramName;
      }
    }

这对我有用!