Question

我刚开始使用dropzone插件，我在项目中使用了laravel。我想知道如何上传文件，以便将它们存储在我的数据库中。这是我的观点：

<form action="{{route('realisation.storeimg')}}" method="POST" files="true" enctype="multipart/form-data"
      data-toggle="validator" role="form" class="dropzone" id="my-awesome-dropzone">
    <input type="hidden" name="_token" value="{{ csrf_token() }}">
    <div class="table table-striped" class="files" id="previews">
        <div id="template" class="file-row">
            <!-- This is used as the file preview template -->
            <div>
                <span class="preview"><img data-dz-thumbnail/></span>
            </div>
            <div>
                <p class="name" data-dz-name></p>
                <strong class="error text-danger" data-dz-errormessage></strong>
            </div>
            <div>
                <p class="size" data-dz-size></p>
                <div class="progress progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100"
                     aria-valuenow="0">
                    <div class="progress-bar progress-bar-success" style="width:0%;" data-dz-uploadprogress></div>
                </div>
            </div>
            <div>
                <button class="btn btn-primary start">
                    <i class="glyphicon glyphicon-upload"></i>
                    <span>Start</span>
                </button>
                <button data-dz-remove class="btn btn-warning cancel">
                    <i class="glyphicon glyphicon-ban-circle"></i>
                    <span>Cancel</span>
                </button>
                <button data-dz-remove class="btn btn-danger delete">
                    <i class="glyphicon glyphicon-trash"></i>
                    <span>Delete</span>
                </button>
            </div>
        </div>
    </div>
    <input type="hidden" name="realisation_id" value="{{$realisation->id}}">

</form>

我上传的路线：

Route::post('/storeimg',[ 'as'=>'realisation.storeimg', 'uses'=>'RealisationController@storeimg' ]);

我的控制员：

 public function storeimg (Request $request)
{    
    $realisation                = Realisation::where('id','realisation_id')->first();
    if($request->file('image')) {
        foreach ($request->file('image') as $image) {

        $realisation_image      =   Realisationimg::where('realisation_id','realisation_id')->first();       
        File::delete($realisation_image->image);
        File::delete($realisation_image->image_thumb);



        $extension = $image->getClientOriginalExtension();
        $name = substr($image->getClientOriginalName(), 0, -4);
        list($width, $height) = getimagesize($image);
        $imgname = str_slug($name, '_');
        $filename = $imgname.'.'.$extension;
        if(file_exists('uploads/realisationimg/cover/' . $filename)){
            do {
                $newname = $imgname.'_'.str_random(3) . '.' . $extension;
            } 
            while(file_exists('uploads/realisationimg/cover/' . $newname));
            $filename = $newname;
        }

        $path = 'uploads/realisationimg/cover/'.$filename;
        $path_thumb = 'uploads/realisationimg/thumb/'.$filename;

        $save = Image::make($image->getRealPath())->resize(1600, null, function ($constraint){
            $constraint->aspectRatio();
        })->save($path);

        $save = Image::make($image->getRealPath())->resize(1600, null, function ($constraint){
            $constraint->aspectRatio();
        })->save($path_thumb);


        $realisation_image->image          =   $path;
        $realisation_image->image_thumb    =   $path_thumb;
        $realisation_image->realisation_id =   $id;
        $realisation_image->save();

    }
    }
    Session::flash('ajouter','ok');
    return redirect(route('realisation.edit',['id'=>$request->get('realisation_id')]));
}

dropzone.js文件中的

我将默认选项更改为以下内容： uploadMultiple：true， paramName：“image”，当我提交dropzone表单时，没有任何内容被执行（没有文件存储，我的数据库中没有任何内容）。有人能指出我的错误吗？感谢。

Answer 1

以下是可能有用的示例代码。

路线：

Route::post('/storeimg', 'GalleryController@storeimg')
        ->name('realisation.storeimg');

控制器：

public function storeimg(Request $request)
    {

        $path = $request->file('file')->store('public/photo');
            if (!$path)
                return url('storage');
            $dirs = explode('/', $path);
            if ($dirs[0] === 'public')
                $dirs[0] = 'storage';

            $data['image'] =  url(implode('/', $dirs));
            Photo::create($data);
            session()->flash('success', 'Photos uploaded successfully');
            return response()->json(['success'=>$data['image']]);

    }

查看：只需打开文件即可将文件发送给控制器。

{!! Form::open([ 'route' => [ 'realisation.storeimg'], 'files' => true, 'enctype' => 'multipart/form-data', 'class' => 'dropzone', 'id' => 'image-upload' ]) !!}

{!! Form::close() !!}

<link rel="stylesheet" href="../dropzone.min.css">

<script src="../dropzone.min.js"></script>

<script type="text/javascript">
    Dropzone.options.imageUpload = {
        maxFilesize         :       1,
        acceptedFiles: ".jpeg,.jpg,.png,.gif"
    };

    //Remove Photo
    $("body").on("click",".remove-item",function(){
        var id = $(this).parent("td").data('id');
        var c_obj = $(this).parents("tr");
        console.log(id);
        $.ajax({
            dataType: 'json',
            type:'delete',
            url: url + '/' + id,
        }).done(function(data){
            c_obj.remove();
        });
    });
</script>

这会产生一个dropzone框，您可以在其中一次添加多张照片

dropzone服务器实现

1 个答案: