Question

我想在我的网络应用程序中创建一个dropzone，用于上传图像并使用ImageMagick对其进行操作。我的dropzone总是自动上传所有图像，并在dropzone中的图像预览中显示“opject Object”错误。服务器上的上传工作正常，但我想将Dropzone.options.myAwesomeDropzone添加到我的dropzone，以便在我提交按钮时上传图片，因为我还想在上传时从表单发送数据。

以下是我在视图中实现的方式：

$    <div class="dropzone" id="my-awesome-dropzone">

视图中的.js（否则无效）

<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.4.0/dropzone.js"></script>

<script type="text/javascript">
    var baseUrl = "{{ url('/') }}";
    var token = "{{ csrf_token() }}";
    var myDropzone = new Dropzone("div#my-awesome-dropzone", {
        url: baseUrl + "/upload",
        params: {
            _token: token
        }
    });

我的控制器：

public function upload()
    {
        $input = Input::all();

        $rules = array(
            'file' => 'image|max:3000',
        );

        $validation = Validator::make($input, $rules);

        if ($validation->fails()) {
            return Response::make($validation->errors->first(), 400);
        }

        $destinationPath = 'uploads'; // upload path
        $extension = Input::file('file')->getClientOriginalExtension(); // getting file extension
        $fileName = rand(11111, 99999) . '.' . $extension; // renameing image
        $upload_success = Input::file('file')->move($destinationPath, $fileName); // uploading file to given path

        if ($upload_success) {
            return Response::json('success', 200);
        } else {
            return Response::json('error', 400);
        }


}

我希望有人可以提供帮助，我在互联网上搜索了好几个小时但找不到能解决我问题的东西。除了我之外，还有数以百计的解决方案适合所有人....

祝你好运

Answer 1

如果您查看dropzone的文档，它会说在配置中您必须将道具autoProcessQueue设置为false，然后调用myDropzone.processQueue()

所以尝试看看这个的外观：

var myDropzone;
var token = "{{ csrf_token() }}";
var baseUrl = "{{ url('/') }}";
$(document).ready(function(){
      myDropzone = new Dropzone("div#my-awesome-dropzone", {
      url: baseUrl + "/upload",
      params: {
         _token: token
         // other fields, here you can also pass a function and have the function return the fields
         name: $("#name").val()
      },
      autoProcessQueue:false,
   });
})

$("#yourButtonId",function(e){
   e.preventDefault();
   myDropzone.processQueue();
});

Dropzone.js总是自动上传文件。无法在dropzone上设置选项#id - Laravel - Voyager - Dropzone.js

1 个答案: