时间戳

首页 > 解决方案 > 如何动态更新 Dropzone URL

jquery - 如何动态更新 Dropzone URL

问题描述

我尝试了几种不同的方法，但我无法让它发挥作用。

我正在尝试在此处遵循此答案动态更改 Dropzone url

我有一个包含各种字段的 for 和两个 dropzone 实例。然而，一个工作正常，这个需要根据为每个文件动态生成的链接将文件上传到保管箱。

我正在尝试更新基于来自服务器的 ajax 响应处理的每个文件的 dropzone url 参数。

我知道 ajax 可以工作并获取我需要的 URL。

jQuery(document).ready(function(){

    Dropzone.autoDiscover = false
    jQuery("#files-uploader").dropzone({        
        url: 'url.com',
        init: function(){   

            var dropzoneobject=this;
            this.on("processing", function (file) {
                jQuery.ajax({
                    url:vendor_ajax_object.ajax_url,
                    type:'POST',
                    data:'action=knpGetUploadLink&filename='+file['name'],                  
                    success: function(data){
                        //data = a URL returned from the server
                        dropzoneobject.options.url = data;
                    },
                    error: function(){

                    }
                });            
            });

        },
        headers: {
            'content-type': 'application/octet-stream'
        },
        success: function (file, response) {
            console.log(response);
            file.previewElement.classList.add("dz-success");
        },
        error: function (file, response) {
            console.log(response);
            file.previewElement.classList.add("dz-error");
        },
        // update the following section is for removing image from library
        addRemoveLinks: true,
        removedfile: function(file) {}

    });

});

将数据变量记录到控制台表示已从服务器返回正确的 URL。在 ajax 成功参数中记录 dropzoneobject.options.url 会显示设置的正确 URL。Dropzone 说它已成功上传，但开发工具中的网络选项卡显示发布到的 URL 是 url.com。

我认为我的时间在某个地方搞砸了。

任何建议都会很棒。

TIA。

标签： jquerydropzone

解决方案

看起来这一切都与时间有关。

换出处理事件并将 autoProcessQueue 设置为 false。

然后在 ajax 调用完成后触发 processQueue。

jQuery(document).ready(function(){

Dropzone.autoDiscover = false
jQuery("#files-uploader").dropzone({        
    url: 'url.com',
    autoProcessQueue: false,
    init: function(){   

        var dropzoneobject=this;
        console.log(dropzoneobject);
        this.on("addedfile", function (file) {
        jQuery.ajax({
                url:vendor_ajax_object.ajax_url,
                type:'POST',
                data:'action=knpGetUploadLink&filename='+file['name'],                  
                success: function(data){
                    dropzoneobject.options.url = data;
                    dropzoneobject.processQueue();
                },
                error: function(){

                }
            });

        });
    },
    headers: {
        'content-type': 'application/octet-stream'
    },
    success: function (file, response) {
        //console.log(response);
        file.previewElement.classList.add("dz-success");
    },
    error: function (file, response) {
        //console.log(response);
        file.previewElement.classList.add("dz-error");
    },
    // update the following section is for removing image from library
    addRemoveLinks: true,
    removedfile: function(file) {}

});

})

推荐阅读