javascript - 使用 dropzone.js 中的 uploadMultiple 时出现错误 : Unexpected field.

Question

我希望有一种方法，让用户可以选择要发送评论的图像。

所以我使用 dropzone.js 。在一个请求中发送多张图像似乎遇到问题。我认为 req.files 会包含一个文件数组，但这并没有发生。现在我看到一个问题，因为 dropzone 添加 [] 以及名称参数内部的索引。

将图像添加到 dropzone 时，我在请求负载中看到类似的内容:

------WebKitFormBoundaryJOpGX6kWaoknKhIN
Content-Disposition: form-data; name="images[0]"; filename="data.png"
Content-Type: image/png


------WebKitFormBoundaryJOpGX6kWaoknKhIN
Content-Disposition: form-data; name="images[1]"; filename="loginButton.png"
Content-Type: image/png


------WebKitFormBoundaryJOpGX6kWaoknKhIN--

我觉得 [0] 和 [1] 给我带来了问题

服务器:

app.post("/files" , upload.array("images"), (req, res) =>{
    console.log("hit here")
    console.log("req.file :", req.file)
    // console.log(req.body)
    console.log(req.files)
    res.send("ok")
})

简单的multer:我之前有过更复杂的

var upload = multer({ dest: "./uploads"})

前端:

<script src = "/dropzone.js"></script>
<script>
    $(function(){
        Dropzone.autoDiscover = false;
        var myDropZone = new Dropzone(".dropzone", {
            url : "/files",
            // uploadMultiple : true,

            autoProcessQueue : false,
             parallelUploads: 5,
            paramName: "images",
            uploadMultiple: true,
            init : function(){
                this.on("success", function(){
                    // alert("success")
                })
                this.on("sendingmultiple", function(){
                    console.log("SENDING MULTIPLE");
                })
                this.on("errormultiple", function(files, response){
                    console.log("ERROR");
                    console.log(response);
                    console.log(files);
                })
            } 
        })
            $("#skip, #login").on("click", function(e){
                myDropZone.processQueue();
            })
    })

</script>
<div class = "dropzone"></div>
   <div id = "skip"> skip </div>
   <div id = "login">login</div>

当我摆脱 uploadMultiple: true, 我得到了 FS 中的图像，但看起来好像发出了多个 post 请求，没有 req.files 数组多个图像。我以为会有

Answer 1

您应该能够通过为 paramName 指定函数而不是字符串来强制使用名称:

paramName: function() { return 'images'; },

这将阻止任何后缀添加到表单字段。