DropZone事件无效 - 需要成功回拨

Lov*_*ock 2 jquery image javascript-events dropzone.js

我正在使用Dropzone和Laravel.目前,图像正在上传到S3.

但我需要知道一种方法,我可以知道文件上传完成后,还可以获取他们的网址.

目前这个:(使用文档)

        var token = "{!! csrf_token() !!}";
        $("div#dropzoneFileUpload").dropzone({
            url: "/project/uploadImage",
            params: {
                _token: token
            }
        });
        Dropzone.options.dropzoneFileUpload = {
            paramName: "file", // The name that will be used to transfer the file
            maxFilesize: 2, // MB
            accept: function(file, done) {

            },
            init: function() {
                this.on("addedfile", function(file) {
                    alert("Added file.");
                });
            }
        };
Run Code Online (Sandbox Code Playgroud)

添加文件时不会发出任何警报,事件似乎没有任何效果.

任何帮助?

作为参考,这是我创建的div:

<div class='dropzone' id='dropzoneFileUpload'></div>
Run Code Online (Sandbox Code Playgroud)

wal*_*876 14

首先,您需要禁用dropzone自动发现,否则dropzone将使用默认选项加载.

其次,最好的方法是在初始化dropzone元素之前设置所有选项,或者在初始化本身中包含所有选项,但不要拆分它们,因为一旦初始化了dropzone元素,我认为不可能更改选项.

要在上传完成后检索网址,一种方法是将网址作为后端的响应发送回浏览器,然后您可以使用该success事件访问该响应.

这是一个例子:

Dropzone.autoDiscover = false;

var token = "{!! csrf_token() !!}";

Dropzone.options.dropzoneFileUpload = {
    url: "/project/uploadImage",
    paramName: "file",
    maxFilesize: 2,
    params: {
        _token: token
    },
    init: function() {
        this.on("addedfile", function(file) {
            alert("Added file.");
        }),
        this.on("success", function(file, response) {
            console.log(response);
        })
    }
}

$('#dropzoneFileUpload').dropzone();
Run Code Online (Sandbox Code Playgroud)