如何动态更新拖放区 URL

Question

我已经尝试了几种不同的方法，但我无法让它工作。

我正在尝试在这里遵循此答案 动态更改拖放区网址

我有一个带有各种字段和两个拖放区的实例。但是，一个工作正常，这个需要根据每个文件的动态生成的链接将文件上传到 dropbox。

我正在尝试更新基于服务器的 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。

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

任何建议都会很棒。

蒂亚。

Answer 1

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

已换出处理事件并将自动进程队列设置为 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) {}
});
})