Laravel 5.1和Dropzone.JS - 不验证图像文件

Question

I am in Laravel 5.1 and am trying to use Dropzone.JS to handle uploading images and videos to my website. It is a very exciting process but unfortunately I am stuck currently and need help.

My routes.php:

Route::post('upload_video', ['as' => 'upload-post', 'uses' =>'ImageController@postUpload']);

My view from which I am sending the dropzone.js request:

<form action="/upload_video" enctype="multipart/form-data" class="dropzone needsclick dz-clickable" id="upload">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
  <div class="dz-message needsclick">
    Drop files here or click to upload.<br> 
  </div>

</form>

 <script>  
  Dropzone.options.upload= {
  url: "http://example.com/upload_video",
  paramName: "file",// The name that will be used to transfer the file
  maxFilesize: 20,
  autoProccessQueue: false,
  uploadMultiple: true,
  addRemoveLinks: false,
  parallelUploads: 10,
  init: function() {
   // this.on("successmultiple", function(file, serverresponse) { window.location.href="http://example.com/your_awesome_profile"; });
  }
};
</script>

My Image Controller:

 <?php
namespace App\Http\Controllers;
use App\Logic\Image\ImageRepository;
use Illuminate\Support\Facades\Input;
class ImageController extends Controller
{
    protected $image;
    public function __construct(ImageRepository $imageRepository)
    {
        $this->image = $imageRepository;
    }
    public function getUpload()
    {
        return view('pages.upload');
    }
    public function postUpload()
    {
        $photo = Input::all();
        $response = $this->image->upload($photo);
        return $response;
    }

My Image Repository:

<?php

namespace App\Logic\Image;
use Auth;
use App\Models\Image;
use App\Models\Video;
use Illuminate\Support\Facades\Validator;
use Illuminate\Support\Facades\Response;
use Illuminate\Support\Facades\Config;
use Illuminate\Support\Facades\File;

class ImageRepository
{
    public function upload( $form_data )
    {
    //return dd($form_data);
    $destinationPath = public_path().'/images/';
    $validator = Validator::make($form_data, Image::$rules, Image::$messages);
        if ($validator->fails()) {
            //**FAILS HERE BUT IS AN IMAGE**
            $validator = Validator::make($form_data, Video::$rules, Video::$messages);
        }

        else{
        $photo = $form_data['file'];
        $file = $photo->getClientOriginalName();
        $filename = pathinfo($file, PATHINFO_FILENAME);
        $extension = pathinfo($file, PATHINFO_EXTENSION);
        $filename2 = $this->sanitize($filename);
        $allowed_filename = $this->createUniqueFilename( $filename2, $extension );
        $filenameExt = $allowed_filename . "." . $extension;
        $uploadSuccess = $photo->move($destinationPath, $filenameExt);
        if( !$uploadSuccess) {
            return Response::json([
                'error' => true,
                'message' => 'Server error while uploading',
                'code' => 500
            ], 500);
        }
        else{

        $sessionImage = new Image;
        $sessionImage->user_id = Auth::user()->id;
        $sessionImage->name = $filename;
        $sessionImage->url = $filenameExt;
        list($width, $height) = getimagesize(public_path().'/images/' . $filenameExt);
        $sessionImage->width = $width;
        $sessionImage->height = $height;
        $sessionImage->save();
        return;
    }

My problem is that, when I upload a .jpg I am being told that it is not a proper file type, even though my validation rules accept a .jpg. I'm not sure what I'm doing wrong, as the validator is failing on the line indicated in my Image Repository. Why does it fail there? At first I thought it was because return dd($form_data); yeilds an array but apparently that is what the validator wants, not a foreach for each file? I'm very confused, please assist and I can provide more code if needed, this is just excerpts.

Update: When I comment out my script in my view, the functionality seems to work perfectly in that images are being uploaded to my server and I can see this happening, but why when I set some options on the dropzone does it suddenly break? Any ideas?

Answer 1

The problem was on the client side. To be able to set options on the Dropzone.js properly, you want to disable autodiscover and set it up programmatically, like so:

Dropzone.autoDiscover = false;

After that, carry on, like so:

 $("#upload").dropzone({
                url: "http://examle.com/upload_video",
                clickable: true,
                uploadmultipe:true,
                maxFilesize: 20,
                init: function() {
    this.on("queuecomplete", function(file, serverresponse) { window.location.href="http://example.com/your_awesome_profile"; });               
  }
            });