Dropzone.js在添加其他数据时未发送文件

我正在尝试将dropzone.js集成到更大的表单中，并将整个表单与上传文件一起发送.但是我只会在上传端点上收到其他数据，而不是通过dropzone.js上传的文件.

I'm trying to integrate dropzone.js into a bigger form and send the entire form along with the upload file. But I only receive the additional data on my upload endpoint, not the file that I uploaded with dropzone.js.

这是我的html表单

            <form enctype="multipart/form-data" method="POST">
                <div class="dropzone mb-2" id="myDropzone" style="width: 400px;">
                    <div class="dz-message needsclick">
                        <button type="button" class="dz-button">
                            Drop files here or click to upload.
                        </button>
                    </div>
                </div>
                <div>
                    <button type="button" class="button" onclick="toggleOptions()">
                        Show options
                    </button>
                    <button type="submit" id="submit-all" class="button is-primary">
                        Upload
                    </button>
                </div>
                <div id="options" class="container is-hidden">
                    <div class="box mt-3">
                        <div class="field">
                            <div class="control">
                                <label class="checkbox">
                                    <input type="checkbox" id="additional-data">
                                    check me or don't
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
            </form>

这是我的dropzone配置

And this is my dropzone config

window.onload = function() {
  $("#myDropzone").dropzone({
    url: 'upload',
    maxFilesize: 2000,
    autoProcessQueue: false,
    uploadMultiple: true,
    parallelUploads: 100,
    maxFiles: 100,
    createImageThumbnails: false,
    init: function() {
        dzClosure = this;

        // for Dropzone to process the queue (instead of default form behavior):
        document.getElementById("submit-all").addEventListener("click", function(e) {
            e.preventDefault();
            e.stopPropagation();
            dzClosure.processQueue();
        });

        //send all the form data along with the files:
        this.on("sendingmultiple", function(file, xhr, form) {
            form.append("data", jQuery("#additional-data").val());
        });
        this.on('error', function(files, response) {
          alert(response);
        });
    }
  })
}

按下上传按钮后，该表单将被发送到/upload 端点，但是该表单仅包含复选框"data"(数据).参数，没有文件正在发送.我在javascript控制台中没有任何错误，并且在dropzone内上传似乎还算完成.

Upon pressing the upload button, the form is being send to the /upload endpoint, but the form only contains the checkbox "data" parameter, there is no file being send. I don't get any errors in the javascript console and inside the dropzone the upload seems to complete just fine.

我的后端收到表单，如下所示:

My backend receiving the form, looks as follows:

@upload.route('/upload', methods=["POST"])
@login_required
def upload_endpoint():
    print("upload endpoint has been hit")
    print(request.form)
    uploaded_file = request.form.get('file')
    print(uploaded_file)
    return redirect(url_for('upload.main_screen')

从这里的3个打印语句中我得到:

and from my 3 print statements here I get:

upload endpoint has been hit
ImmutableMultiDict([('data', 'on')])
None

所以我想知道，为什么文件没有被传输?而要传输它，我必须做些什么改变?

So I'm wondering, why is the file not being transmitted? And what do I have to change for it to be transmitted?