Laravel Drag-Drop file uploads

routes/web.php

Открыть

        
Route::get('image/upload','HomeController@fileCreate');
Route::post('image/upload/store','HomeController@fileStore');
Route::post('image/delete','HomeController@fileDestroy');
        
    

App/Http/Controllers/HomeController.php

Открыть

    
    public function fileCreate()
    {
        //шаблон с формой
        return view('index');
    }

    public function fileStore(Request $request)
    {
        $image = $request->file('file');
        $imageName = $image->getClientOriginalName();
        $image->move(public_path('images'),$imageName);
        
        /*$imageUpload = new ImageUpload();
        $imageUpload->filename = $imageName;
        $imageUpload->save();*/
        return response()->json(['success'=>$imageName]);
    }

    public function fileDestroy(Request $request)
    {
        $filename =  $request->get('filename');
       // ImageUpload::where('filename',$filename)->delete();
        $path=public_path().'/images/'.$filename;
        if (file_exists($path)) {
            unlink($path);
        }
        return $filename;  
    }
    

resources/vuews/index.blade.php

Открыть

    
//зависимости
    link   href https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.4.0/min/dropzone.min.css
    script src http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js
    script src https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.4.0/dropzone.js
    
    
//форма
   < form >
        action=" { { url('image/upload/store') } }" 
        enctype="multipart/form-data" 
        class="dropzone"
        id="dropzone" >
     @csrf    
    < / form > 

//script

  Dropzone.options.dropzone =
         {
            maxFilesize: 12,//mb
            renameFile: function(file) {
                var dt = new Date();
                var time = dt.getTime();
               return time+file.name;
            },
            acceptedFiles: ".jpeg,.jpg,.png,.gif,.mp3",
            addRemoveLinks: true,
            timeout: 5000,
            removedfile: function(file) 
            {
                var name = file.upload.filename;
                $.ajax({
                    headers: {
                                'X-CSRF-TOKEN': $('input[name="_token"]').val()
                            },
                    type: 'POST',
                    url: '{{ url("image/delete") }}',
                    data: {filename: name},
                    success: function (data){
                        console.log("File has been successfully removed!!");
                    },
                    error: function(e) {
                        console.log(e);
                    }});
                    var fileRef;
                    return (fileRef = file.previewElement) != null ? 
                    fileRef.parentNode.removeChild(file.previewElement) : void 0;
            },
            success: function(file, response) 
            {
                console.log(response);
            },
            error: function(file, response)
            {
               return false;
            }
    
Тэги:

Комментарии (0)


Оставить комментарий

Success/Error Message Goes Here

TOP