在创建新用户后使用Dropzone.js上传，发送标头

我正在使用一个很棒的插件 – dropzone.js（dropzonejs.com）来使我的网站在注册新用户时更加花哨。

基本上，用户填写表单，将几个图像放入“dropzone”，然后单击“提交”，这会触发将表单发布到php脚本的ajax调用。

我将dropzone参数设置为enqueForUpload：false，这样可以防止文件自动上传，因为我需要在创建新用户ID后将它们上传到uploads / $ userid。 我可以给dropzone header params，我假设发布到url，类似于ajax调用，而不是数据：{‘userid’：userid}，dropzone使用header：{‘userid’：userid} …但是，dropzone在document.ready上初始化，并且由于尚未声明userid变量，dropzone无法初始化。

我猜我需要用document.ready初始化dropzone，但还没有给它标题。 然后在ajax表单处理成功并返回userid后，调用dropzone上传并在该点为其提供标题。 问题是，我不知道需要调用哪些代码来实现这一点。

准备好初始化Dropzone：

$(document).ready(function(){ $('#dropzone').dropzone({ url: 'dropzoneprocess.php', maxFilesize: 1, paramName: 'photos', addRemoveLinks: true, enqueueForUpload: false, }); }); 

然后…

 $('#submit').on('click', function(){ validation crap here $.ajax({ type: 'post', url: 'postform.php', data: {'various': form, 'values': here} datatype: 'json', success: function(data){ var userid = data.userid; /* (and this is what I can't figure out:) tell dropzone to upload, and make it post userid to 'dropzone.php' */ }); }); 

Answer 1

如果您使用最新的Dropzone版本，则删除参数enqueueForUpload ，支持autoProcessQueue ，这使整个排队更容易。

因此，只要您想要上传所有文件，只需调用myDropzone.processQueue()即可。

要向XHR添加其他参数，您只需注册到sending事件，该事件将xhr对象作为第二个参数，将formData作为第三个参数，并formData添加数据。 像这样的东西：

 myDropzone.on("sending", function(file, xhr, formData) { // add headers with xhr.setRequestHeader() or // form data with formData.append(name, value); }); 

Answer 2

我使用了enyo的答案，但我在我的页面中使用了许多带有data-id属性的dropzones，因此我使用了：

 $('div.dropzone').dropzone({ url: 'img.php' }); var sendingHandler = function(file, xhr, formData) { formData.append('id', $(this.element).data('id')); }; $('div.dropzone').each(function() { Dropzone.forElement(this).on('sending', sendingHandler); });