DropzoneJS:上传成功后如何获得PHP响应 - DropzoneJS: How to get PHP response after upload success?

我正在尝试在我的网站上实现Dropzone。我想侦听"成功"事件，然后在上传完成后获取服务器响应并从中将一些信息添加到与 DropZone 相同的页面上的表单中。

我想在服务器响应中获取的信息是指向该文件的直接链接。

Dropzone的网站：http://www.dropzonejs.com/

我的项目网站：

http://37.34.62.131/test/

所以我在我的项目的旧版本中完成了这个，但我无法弄清楚如何使用 dropzone 做到这一点.js

工作示例：

http://37.34.62.131/test/uploader%201.0/

我尝试做的是，当文件上传后，我想通过下载链接将 PHP 响应恢复到同一页面上，如下所示。

我也可以把我的源代码发给你，这样你就可以自己找了。

我想在响应中看到我的 PHP 代码：

        print '<h2>Picture Uploaded Successfuly!!!!</h2> <p id="codes">
      <img src="'.$imgurl.'" height="300" alt="Uploaded Picture" >
        <label for="codebb">BBCode:</label>
        <input type="text" id="codebb" value="[URL='.$siteurl.'][IMG]'.$dlurl.'[/IMG][/URL]" onclick="javascript:this.focus();this.select();" readonly="true" /><br />
        <label for="codehtml">HTML Code: </label>
        <input type="text" id="codehtml" value=''&lt;a href="'.$siteurl.'"&gt;&lt;img src="'.$dlurl.'" alt="'.$alt.'" /&gt;&lt/a&gt;'' onclick="javascript:this.focus();this.select();" readonly="true" /><br />
        <label for="codedirect">Direct Link:</label>
        <input type="text" id="codedirect" value="'.$dlurl.'" onclick="javascript:this.focus();this.select();" readonly="true" /></p>';
        echo ".$newname";

谁能帮我了解我错过了什么？

查看您的网站，似乎您能够解决问题。

无论如何，这是为可能仍在寻找的人准备的。您需要使用两个参数添加函数成功。返回的第一个参数始终是文件，第二个参数是响应。

另一个答案有这个，但这个回答最初没有包括它。将自动发现设置为 false 很重要，或者这个示例（如文档中提供）不起作用。测试于 Win10上的Chrome/IE/Edge。

样本：

Dropzone.autoDiscover = false;
$(function() {
        Dropzone.options.uiDZResume = {
            success: function(file, response){
                alert(response);
            }
        };
    });

我在使用dropzone时遇到了一些问题，但我找到了这个解决方案：

new Dropzone("#myDropzone", { 
    maxFilesize: 2, // MB
    init: function() {
        this.on("success", function(file, responseText) {
            console.log(responseText);
        });
    }
});

经过验证的答案对我不起作用。这样做：

$(".mydrop").dropzone({ 
    url: upload_url, 
    success : function(file, response){
        console.log(file);
        console.log(response);
    }
});

在 php 方面：

echo json_encode($whateverouwant);
die();

以上

都不适合我，但是这个...

<script>
    Dropzone.autoDiscover = false;
$(function(){
    uploader = new Dropzone(".dropzone",{
        url: "http://locahost/upload",
        paramName : "uploadedFiles",
        uploadMultiple :false,
        acceptedFiles : "image/*,video/*,audio/*",
        addRemoveLinks: true,
        forceFallback: false,
        maxFilesize:1000,
        parallelUploads: 100,
    });//end drop zone
  uploader.on("success", function(file,response) {
   console.log(response)
  });

});//end jq
</script>

请注意，分块上传存在问题，并且在成功时永远不会从服务器返回响应。在这种情况下，所有以前的答案都不起作用。解决方案可能是手动解析 XHR 响应，如下所示：

const galleryZone = new Dropzone(".dropzone-gallery", {
    url: your_upload_url_in_here,
    chunking: true,
    forceChunking: true,
    chunkSize: 2000000,
    success: (file, response) => {
        console.log(JSON.parse(file.xhr.response));
    }
});

或者，您可以在Dropzone的存储库中检查问题这里 https://gitlab.com/meno/dropzone/issues/51#note_47553173

但是

如果我使用此代码，那么我必须从表单中删除 dropzone 类。否则它将引发此错误。

throw new Error("Dropzone already attached.");
---------------------------------------------
new Dropzone("#myDropzone", { 
    maxFilesize: 2, // MB
    init: function() {
        this.on("success", function(file, responseText) {
            console.log(responseText);
        });
    }
});