错误:意外字段。使用dropzone.js中的uploadMultiple

时间:2017-06-21 06:33:06

标签: javascript node.js express dropzone.js multer

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

所以我使用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")
})

简单的傻瓜:我之前有一个更复杂的

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中的图像,但看起来好像有多个帖子请求,没有req.files数组有多个图像。我以为会有

1 个答案:

答案 0 :(得分:4)

您应该可以通过为paramName而不是字符串指定函数来强制命名:

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

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