使用 dropzone 将附加数据发送到后端

Question

我正在尝试通过 dropzone 将图像文件的特定（已知）位置 ID 发送到后端，该文件将被上传到服务器。尽管正在使用 formData.append()，但我看到 appended.Instead 什么都没有，只是出现了这个“FormData {}”。

dropzoneObject.on("sending", function(file, xhr, formData){
    var nameOfFile = $(file.previewElement).find(".dz-filename").text();
    var positionOfFile = fpos;
    //console.log("The file who's being sent is named: "+nameOfFile+" and its position id is: "+positionOfFile);
    formData.append("fpos", fpos);
});

我希望在示例中看到 fpos=16；

Answer 1

不知道您的特定错误，但这里有一个简单示例，说明如何使用 jQuery 通过 dropzone 发送额外数据并在后端使用 php 接收数据。

html:

<form id="myForm" class="dropzone"></form>

js:

Dropzone.autoDiscover = false;
$('.dropzone').dropzone ({
        url: "upload.php",
        init: function() {
            this.on("sending", function(file, xhr, formData){
                formData.append("fpos", 777)
            }),
            this.on("success", function(file, xhr){
                alert(file.xhr.response);
            })
        },
});

成功事件只是为了演示如何访问服务器发送的响应：

php:

if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') 
    {
        echo "RECEIVED ON SERVER: \n";
        echo "FILES: \n";
        print_r($_FILES);
        echo "$_POST: \n";
        print_r($_POST);
    }

php 只是将收到的相同数据发送回客户端，只是为了显示可访问的位置。

使用 dropzone 将附加数据发送到后端

Send additional data with dropzone to the backend

php

ajax

jquery

xmlhttprequest

dropzone.js